Webpack:为什么vue-loader不可以转换? [英] Webpack: Why does vue-loader not transpile?

问题描述

我正在使用vue-loader V14和Webpack 3.12.在vue-loader文档中说，将使用babel-loader自动转译javascript，但是当我查看输出时，仍然看到ES6，例如:

I am using vue-loader V14 and Webpack 3.12. In the vue-loader documentation is says that javascript will automatically be transpiled using babel-loader, but when I look at the output I still see ES6, such as:

data() {
    return {
        current: ''
    };
},

这是webpack配置的(相关部分):

Here's the (relevant parts of) the webpack config:

resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'
    }
},
module: {
    rules : [
        {
            test: /\.js$/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: ['env']
                }
            }
        },
        {
            test: /\.vue$/,
            use: 'vue-loader'
        }
    ]
}

我尝试将vue$别名设置为指向vue.common.js版本.

I have tried setting the vue$ alias to point to the vue.common.js version.

我在做什么错了?

更新:这是我尝试使用vue-loader规则的另一个配置:

UPDATE: Here's another config I tried for the vue-loader rule:

{
    test: /\.vue$/, 
    loader: "vue-loader",
    options: {
        loaders: { js: 'babel-loader' }
    }
}

推荐答案

我必须在.babelrc

"presets": [
    ["env", { "modules": "commonjs" }]
],

这篇关于Webpack:为什么vue-loader不可以转换?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！