如何使用 Webpacker 将 `includePaths` 添加到 Sass 加载器

Posted 2023-02-22

【中文标题】如何使用 Webpacker 将 `includePaths` 添加到 Sass 加载器

【英文标题】：How to add `includePaths` to Sass loader with Webpacker

【发布时间】：2018-07-15 13:17:19

【问题描述】：

我覆盖了 sass-loader 配置以包含 node_modules 路径：

// config/webpack/environment.js

const  environment  = require('@rails/webpacker')

environment.loaders.prepend('sass', 
    test: /\.(css|scss|sass)$/,
    use: [
        loader: 'style-loader'
    , 
        loader: 'css-loader'
    , 
        loader: 'sass-loader',
        options: 
            includePaths: ['node_modules'],
        
    ]
)

module.exports = environment

Webpack 编译没有错误，但是它不再输出 application.css 包。

我进行了更改，因为我从我的 Sass 文件中导入的 NPM 插件从其他插件中导入代码导致编译时出错。

【问题讨论】：

@DayOne 区别在哪里？

【参考方案1】：

找到解决方案：

environment.loaders.get('sass').use.find(item => item.loader === 'sass-loader').options.includePaths = ['node_modules']

参考：https://github.com/rails/webpacker/blob/3-x-stable/docs/webpack.md

【讨论】：

您从哪里知道如何添加加载程序？我正在尝试添加 css-loader 和 style-loader，但我不知道如何让它们工作。您的实际 css 导入是什么样的？

@Csteele5 这个 Github 问题提到了它：github.com/rails/webpacker/issues/782 和 Webpacker 文档中的这个部分，虽然不是特定于 sass-loader 解释了如何：github.com/rails/webpacker/blob/master/docs/…