what is `@import '~bootstrap/scss/bootstrap.scss';` meaning at `src/styles/main.scss`

2
open
lovetingyuan
lovetingyuan
Posted 4 years ago

what is `@import '~bootstrap/scss/bootstrap.scss';` meaning at `src/styles/main.scss` #1325

there is a code @import '~bootstrap/scss/bootstrap.scss';, I know it is requiring bootstrap as a denpendence, but I do not know what the character ~ meaning of, it seems like indicating the path is a third module path, is it a webpack feature or a sass feature or customer config? I can not find any doc for it, hope for replay, thanks

YutHelloWorld
YutHelloWorld
Created 4 years ago

https://doc.webpack-china.org/loaders/sass-loader#-import-

webpack 提供一种解析文件的高级的机制。sass-loader 使用 node-sass 的 custom importer 特性,将所有的 query 传递给 webpack 的解析引擎(resolving engine)。只要它们前面加上 ~,告诉 webpack 它不是一个相对路径,这样就可以 import 导入 node_modules 目录里面的 sass 模块:

lovetingyuan
lovetingyuan
Created 4 years ago

@YutHelloWorld thanks!