如何配置webpacker来使用手写笔，这样我就可以使用Vuetify了？

Question

我有webpacker为基本的vue.js/rails应用程序工作，但我想配置它，以便将手写笔文件编译成css，这样我就可以使用Vuetify了。有人知道怎么做吗？我现有的独立工作平台vuetify/vue.js应用程序有以下webpack配置：

module: {
loaders: [
  {
    test: /\.vue$/,
    loader: 'vue'
  }, 
  {
      test: /\.s[a|c]ss$/,
      loader: 'style!css!sass'
  }
]
},
vue: {
  loaders: {
    scss: 'style!css!sass'
  }
}

webpacker的语法对于webpacker来说似乎有点不同。我的rails应用程序有/config/webpack/environment.js

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

environment.loaders.set('styl', {
test: /\.styl$/,
use: 'stylus-loader'
}),
environment.loaders.set('styl', {
test: /\.s[a|c]ss$/,
use: 'style!css!sass'
})
module.exports = environment

但是我得到了这个错误：未定义变量：“$chip-标签颜色”.in.in(第6行，列134917)。

有人有关于如何用Rails Webapcker配置Vuetify的例子吗？

Answer 1

使用webpacker 3，您可以添加加载器，如文档的装载机部分所解释的那样。

下面是我在webpack/environment.js . is中为手写笔加载程序所做的配置

environment.loaders.append('stylus', {
  test: /\.styl$/,
  use: ['style-loader', 'css-loader', 'stylus-loader']
})

另外，更多信息可以在vuetify的网站上找到：用webpack安装触笔加载程序和这里。

而且，我认为environment.loaders.set不再有效了。使用附加。