首页 文章

如何配置webpacker以使用手写笔，以便我可以使用Vuetify？

提问于
浏览 次
3

我有webpacker工作基本的vue.js / rails应用程序，但我想配置它所以stylus文件编译为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

但我收到此错误： Undefined variable: "$chip-label-color".in /rails_project_path/node_modules/vuetify/dist/vuetify.min.css (line 6, column 134917)

有没有人有一个如何使用Rails Webapcker配置Vuetify的示例？

ruby-on-rails webpack vue.js vuetify.js webpacker

1 回答

  • 1

    使用webpacker 3，您可以按照文档的loaders部分中的说明添加加载器 .

    这是我的webpack / environment.js中针对stylus-loader的配置

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

    另外的信息可以在vuetify的网站上找到：setting up stylus loader with webpack和here

    另外，我认为environment.loaders.set不再适用 . 使用追加 .

    回复于

相关问题