css - Webpack sass-loader 生成错误/损坏的源映射

Question

我正在尝试为一个大型项目生成正确的源映射（使用 monorepo、用于从其他兄弟项目加载文件的别名以及引导程序）。下面是我的webpack.config.js文件。目前，它会生成命中或未命中源映射，有时会生成 ok（例如，对于引导文件，映射是完美的），有时它指向与原始文件和行完全不同的文件和行，有时甚至会生成错误的 scss文件映射。我尝试启用compressed: true，但它只会让一切变得更加混乱，一些文件指向正确，但大多数文件指向错误的行或文件。

SCSS 文件正在按应有的方式进行编译，但源映射命中或未命中。我的配置有问题吗？任何用于生成正确源图的简单样板文件？

    {
        mode: 'none',
        name: 'scss',
        entry: scssFiles, // list of entries generated by function
        devtool: 'source-map',
        stats: 'errors-warnings',
        output: {
            path: path.resolve(__dirname),
            filename: '[name].css'
        },
        module: {
            rules: [{
                test: /\.scss$/,
                use: ExtractTextPlugin.extract({
                    use: [
                        {
                            loader: 'css-loader',
                            options: {
                                sourceMap: true,
                                url: false,
                                minimize: false
                            }
                        },
                        {
                            loader: 'postcss-loader',
                            options: {
                                sourceMap: true,
                                plugins: [
                                    require('autoprefixer')()
                                ]
                            }
                        },
                        {
                            loader: 'sass-loader',
                            options: {
                                sourceMap: true,
                                // outputStyle: 'compressed', // Have tried it on too.
                                includePaths: [
                                    path.resolve('node_modules'),
                                    path.resolve('node_modules/flag-icon-css/sass')
                                ]
                            }
                        }
                    ]
                })
            }]
        }

标签： csswebpacksasssource-mapssass-loader