如何搭建es6开发环境

node.js安装此过程没有难点，略过下载完成后可以通过node -v和npm -v来查看是否安装成功以及版本后webpack 安装新建一个目录(项目名称), 进入该项目，npm init, 然后一路回车即可。(会生成一个package.json文件)在根目录下创建src目录，并在src目录下创建index.js文件在项目的根目录下执行 npm install webpack webpack-cli –save-devnpm install webpack-dev-server html-webpack-plugin –save-devwebpack-dev-server是启动一个本地的服务，html-webpack-plugin是一个插件，用来使用html的模板在根目录下创建webpack.dev.config.js文件编辑package.json文件：“scripts”: { “dev”: “webpack-dev-server –config ./webpack.dev.config.js –mode development”}安装babel相关插件npm install babel-core babel-loader babel-polyfill babel-preset-es2015 babel-preset-latest –save-dev在项目的根目录下创建.babelrc{“presets”: [“es2015”, “latest”],“plugins”: []}修改webpack.dev.config.js 并运行在webpack.dev.config.js种添加内容const path = require(“path”);const HtmlWebpackPlugin = require(“html-webpack-plugin”);module.exports = { entry: ‘./src/index.js’,// 入口文件 output: { path: __dirname, filename: ‘./release/bundle.js’ }, plugins: [ new HtmlWebpackPlugin({ template: ‘./index.html’ }) ], devServer: { contentBase: path.join(__dirname,’./release’), //运行的目录 open: true, // 自动刷新浏览器 port: 9002 // 端口号 }}现在就可以在src下的index.js中写es6代码啦运行npm run dev; 可以看到会自动访问 localhost:9002