我不能在webpack配置文件中使用ES6

问题描述：

在webpack配置文件中可以使用ES6（尤其是import - 而不是require）吗？我不能在webpack配置文件中使用ES6

我有例如

import webpack from 'webpack';

，但我收到以下错误

(function (exports, require, module, __filename, __dirname) 
{ import webpack from'webpack'; 

SyntaxError: Unexpected reserved word import

如下因素this thread我命名的配置 'webpack.config.babel.js'，我有通天（6.0.15），babel-核心（6.1.2）安装为dev deps，但没有任何效果。试用WinXP。

感谢您的任何帮助。

如果通过通天编译成节点运行它，它可能会工作。即'babel webpack.config.es6 |节点“，但没有把它放到webpack中。 – 4m1r

答

你可以用杯和巴贝尔/注册这样的：

var gulp = require('gulp'); 
var webpack = require('webpack'); 
var gutil = require('gutil'); 
var babel = require('babel/register'); 
var config = require(path.join('../..', 'webpack.config.es6.js')); 

gulp.task('webpack-es6-test', function(done){ 
    webpack(config).run(onBuild(done)); 
}); 

function onBuild(done) { 
    return function(err, stats) { 
     if (err) { 
      gutil.log('Error', err); 
      if (done) { 
       done(); 
      } 
     } else { 
      Object.keys(stats.compilation.assets).forEach(function(key) { 
       gutil.log('Webpack: output ', gutil.colors.green(key)); 
      }); 
      gutil.log('Webpack: ', gutil.colors.blue('finished ', stats.compilation.name)); 
      if (done) { 
       done(); 
      } 
     } 
    } 
}

...和你的WebPack配置可以有任何ES6。经过测试并为我工作。

答

Rabet，

你有链接到你的代码的回购？如果您可以链接我们，可能对调试非常有帮助。听起来你可能会错过babel-loader包。

我已经写了关于获取在ES6中配置webpack（反应）的教程。

下面是一些可能与您有关的摘录。

import path from 'path' 
export default { 
    entry:['./js/app.js', 
    ], 

    output: { 
    filename: 'bundle.js', 
    path: path.join(__dirname, 'build'), 
    publicPath: 'http://localhost:8080/', 
    }, 

    module: { 
    loaders: [{ 
     test: /\.js$/, 
     exclude: /node_modules/, 
     loaders: ['react-hot', 'babel'], 
    }], 
    }, 

}

和我的package.json文件

{ 
“name”: “Todo_tutorial”, 
“version”: “1.0.0”, 
“description”: “”, 
“main”: “index.js”, 
“scripts”: { 
“test”: “echo \”Error: no test specified\” && exit 1", 
“build”: “webpack --colors --progress”, 
“start”: “webpack-dev-server --hot --inline --color --progress ” 
}, 
“author”: “”, 
“license”: “ISC”, 
“dependencies”: { 
“react”: “^0.14.0” 
}, 
“devDependencies”: { 
“babel-core”: “^5.8.25”, 
“babel-loader”: “^5.3.2”, 
“flux”: “^2.1.1”, 
“webpack”: “^1.12.2”, 
“webpack-dev-server”: “^1.12.0” 
} 
}

来源：https://medium.com/@ColeMurray/react-flux-in-es6-pt-1-2-e2a7b4aa074e

我不能在webpack配置文件中使用ES6

相关推荐