Question

当我使用scss或sass时，我使用webpacker gem进行rails开发，编译器可以处理 .vue 文件但不适用于普通css。

这有效：

<style lang="scss" scoped>
form label{
  color: red !important;
}
</style>

但这不是

<style scoped>
form label{
  color: red !important;
}
</style>

webpack中sass的配置部分

module.exports = {
  test: /.vue$/,
  loader: 'vue-loader',
  options: {
    extractCSS: true,
    loaders: {
      js: 'babel-loader',
      file: 'file-loader',
      scss: 'vue-style-loader!css-loader!postcss-loader!sass-loader',
      sass: 'vue-style-loader!css-loader!postcss-loader!sass-loader?indentedSyntax'
    }
  }
}

Answer 1

这真的很奇怪，但它只是起作用，改变了config/webpack/loaders/sass.js

中的一行

{loader：＆＃39; css-loader＆＃39;，options：{minimize：env.NODE_ENV ===＆＃39; production＆＃39; }，

与

＆＃39; CSS-装载机＆＃39;，

并运行./bin/webpack-dev-server并且它可以编译css，然后我将更改切换回原始版本并且它正在工作。

{loader：＆＃39; css-loader＆＃39;，options：{minimize：env.NODE_ENV ===＆＃39; production＆＃39; }，

我不明白发生了什么，但它有效，我尝试了很多东西。

如何在.vue文件中编译css

1 个答案: