在自学vue-loader+webpack时碰到的问题

这是代码部分:

module.exports ={
    entry: './main.js',
    //出口文件
    output: {
        path: __dirname,
        filename:'build.js'
    },
    module:{
        loaders:[
            {test:/\.vue$/,loader:'vue'},
            {test:/\.js$/,loader:'babel',exclude:/node_modules/}
        ]

    },
    babel:{
        presets:['es2015'],
        plugins:['transform-runtime']
    }
}

报错如下:
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

  • configuration has an unknown property 'babel'. These properties are valid:
    object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loa der?, module?, name?, node?, output?, parallelism?, performance?, plugins?, profile?, recordsInputPath ?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? }

For typos: please correct them.
For loader options: webpack 2 no longer allows custom properties in configuration.

 Loaders should be updated to allow passing options via loader options in module.rules.
 Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader               :
 plugins: [
   new webpack.LoaderOptionsPlugin({
     // test: /\.xxx$/, // may apply this only for some modules
     options: {
       babel: ...
     }
   })
 ]

npm ERR! Windows_NT 10.0.15063
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin \npm-cli.js" "run" "dev"
npm ERR! node v6.9.1
npm ERR! npm v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! vue-loader@1.0.0 dev: webpack-dev-server --inline --hot --port 8082
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-loader@1.0.0 dev script 'webpack-dev-server --inline --hot --port 8082'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the vue-loader package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! webpack-dev-server --inline --hot --port 8082
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs vue-loader
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls vue-loader
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:

这好像是说我的webpack2不支持这种写法,但是我卸载之后改下了webpack1也不行啊,一样的报错,不知道问题在哪。

阅读 4.3k
1 个回答

不知道是不是我见得少,没见过在webpack.config.js 写babel属性配置的。
一般是在 .babelrc 写 babel 的配置,如下:

clipboard.png

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题