@import '~bootswatch/dist/flatly/_variables.scss';
@import '~bootstrap/scss/bootstrap';
@import '~bootswatch/dist/flatly/_bootswatch';
@import 'assessments';
@import 'main';

这就是我的application.scss的样子 . 所以当我运行webpack来编译我的assests时,它给了我这个错误:

Module build failed: 
@import '~bootswatch/dist/flatly/_variables';
^
      Invalid CSS after "...load the styles": expected 1 selector or at-rule, was "var content = requi"
      in /home/owner/Programming/work/wellonomics/app/new_assets/stylesheets/application.scss (line 1, column 1)
Error: 
@import '~bootswatch/dist/flatly/_variables';

这是我的environment.js配置文件:

const { environment } = require('@rails/webpacker');

const webpack = require('webpack');
const path = require('path');
const glob = require('glob');

environment.config.merge({
    module: {
        rules: [{
            test: /\.scss$/,
            use: [{
              loader: "style-loader"
            }, {
              loader: "css-loader"
            }, {
              loader: "sass-loader",
              options: {
                includePaths: [path.resolve(process.cwd(), 'node_modules')]
              }
            }]
        },
        {
          test: /.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
          use: [{
            loader: 'file-loader',
            options: {
              name: '[name].[ext]'
            }
          }]
       }
      ]
    },
    resolve: {
      alias: {
        $: 'jquery',
        jQuery: 'jquery'
      }
    }
});
module.exports = environment;

我已经阅读了很多github问题和webpacker doc以及webpack doc sass-loader doc,这里的问题是众所周知的,sass-loader无法解析url,但无论我做什么我只是无法编译它最后用'bin / webpack',有趣的东西,当我运行webpack-dev-server时,最初也无法编译,然后我只是对我的application.scss进行radom更改它重新运行并成功编译了我的所有资料!请gus帮我解决这个问题,或者至少有人可以建议任何好的scss进入css编译器 . 谢谢!我已经尝试了'resolve-url-loader'而它没有用,或者我用错了...