如何在rails / webpacker / vue应用程序中添加“babel-preset-stage-2”加载程序?

时间:2017-12-21 19:19:57

标签: ruby-on-rails webpack ruby-on-rails-5 babeljs webpacker

我有一个rails 5应用程序,我使用命令rails webpacker:install:vue安装了vue。我只需要添加“babel-preset-stage-2”加载器,但我无法弄清楚如何做到这一点。

我在config / webpack / loaders / vue.js中阅读this documentation,这是我所做的(但不起作用):

const { dev_server: devServer } = require('@rails/webpacker').config

const isProduction = process.env.NODE_ENV === 'production'
const inDevServer = process.argv.find(v => v.includes('webpack-dev-server'))
const extractCSS = !(inDevServer && (devServer && devServer.hmr)) || isProduction

module.exports = {
  test: /\.vue(\.erb)?$/,
  use: [{
    loader: 'vue-loader',
    options: { extractCSS }
  }]
}

module.exports = {
  test: /\.vue(\.erb)?$/,
  use: [{
    loader: 'babel-preset-stage-2'
  }]
}

1 个答案:

答案 0 :(得分:0)

你已经包含了2个module.exports,这不是commonJS模块的工作方式。如果您阅读webpack docs,您应该可以执行以下操作:

module.exports = {
  module: {
    rules: [
      {
        test: /\.vue(\.erb)?$/,
        loader: 'vue-loader',
        options: { extractCSS }
      },
      {
        test: /\.vue(\.erb)?$/,
        loader: 'babel-preset-stage-2'
      }
    ]
  }
}