Parcel 使用scss引用node_modules错误 base.scss:23:9

> parcel index.html --open

Server running at http://localhost:1234 
×  D:\WorkSpace\VSCode\project\src\base.scss:23:9: Can't find stylesheet to import.
   ╷
23 │ @import "@material/elevation/mixins";
   │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵

原因

webpack有sassloader配置项可以include资源文件夹
Parcel 是简化了配置过程 没有直接提供配置文件

解决方案

1. 根目录新建.sassrc.js 写入以下内容

// .sassrc.js
const path = require('path')
const CWD = process.cwd()
module.exports = {
  "includePaths": [
    path.resolve(CWD, 'node_modules'),
    path.resolve(CWD, 'src')
  ]
}

可选的第二种方案

如果包中不含二级Import 直接在Scss文件 @import "~XXX/XXX/XXX.scss";~代表了node_modules/
直接按路径写就行，但是引入的文件中还有 import 这就不行了，请使用上面的方法

可能有用的网站

1. https://github.com/parcel-bundler/parcel/issues/39
2. https://github.com/material-components/material-components-web/issues/2800
3. https://github.com/parcel-bundler/parcel/issues/383