如何在webpack中使用ES6。配置吗? 就像这个回购 https://github.com/kriasoft/react-starter-kit 呢?
例如:
使用这个
import webpack from 'webpack';
而不是
var webpack = require('webpack');
与其说这是一种需求,不如说是一种好奇心。
如何在webpack中使用ES6。配置吗? 就像这个回购 https://github.com/kriasoft/react-starter-kit 呢?
例如:
使用这个
import webpack from 'webpack';
而不是
var webpack = require('webpack');
与其说这是一种需求,不如说是一种好奇心。
当前回答
试着将你的配置命名为webpack.config.babel.js。你应该在项目中包含通音寄存器。在react-router-bootstrap的例子。
Webpack依赖于内部的解释来实现此工作。
其他回答
我最好的方法与npm脚本是
node -r babel-register ./node_modules/webpack/bin/webpack
并根据您对Babel的需求配置其余脚本
试着将你的配置命名为webpack.config.babel.js。你应该在项目中包含通音寄存器。在react-router-bootstrap的例子。
Webpack依赖于内部的解释来实现此工作。
看了无数的文件之后……
只需安装es2015预置(不是env !!)并将其添加到 .babelrc: { “预设”:( ["es2015", {"modules": false}] ] } 将webpack.config.js重命名为webpack.config.babel.js
作为@bebraw建议的替代方案,您可以使用ES6+语法创建一个JavaScript自动化脚本:
// tools/bundle.js
import webpack from 'webpack';
import webpackConfig from './webpack.config.js'; // <-- Contains ES6+
const bundler = webpack(webpackConfig);
bundler.run(...);
用巴别塔来执行:
$ babel-node tools/bundle
附注:当你需要实现更复杂的构建步骤时,通过JavaScript API调用webpack可能是一个更好的方法(比通过命令行调用它)。例如,在服务器端bundle准备好后,启动Node.js应用服务器,在Node.js服务器启动后,启动BrowserSync开发服务器。
参见:
React Starter Kit(包。Json /scripts, tools/bundle.js, tools/webpack.config.js) React静态样板(run.js, webpack.config.js,节点运行) 你可能不需要Gulp.js
没有足够的代表来评论,但我想为任何TypeScript用户添加一个类似于上面@Sandrik的解决方案
我有两个脚本,我使用指向webpack配置(JS文件),包含ES6语法。
"start-dev": "./node_modules/.bin/ts-node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js——config. /webpack/webpack.config.dev.js"
and
"./node_modules/.bin/ts-node ./node_modules/webpack/bin/webpack.js——config webpack/webpack.config.js"