1JavaScript设计模式--ES6环境搭建

图片.png

1、环境搭建。使用的是webstorm。已经安装过了 node.js 。
node -v 查看版本号。

安装 npm: npm install
查看版本：npm -v ;

图片.png

npm init

初始化npm环境。输入命令后默认就可以，一直按Enter，最后按 y 。保存配置文件。会生成一个package.json文件。自己可以去修改。

图片.png

安装npm淘宝镜像：npm install -g cnpm --registry=https://registry.npm.taobao.org
提高模块安装速度吧。

图片.png

安装 webpack 和 cli ，安装完成后 package.json 文件会发生变化。

npm install webpack webpack-cli --save-dev

"dev": "webpack --config ./webpack.dev.config.js --mode development"

添加一个dev。

图片.png

然后运行 npm run dev

图片.png

会编译出几个文件。

图片.png
安装两个插件：webpack-dev-server 和 html-webpack-plugin 输入命令的时候不能有空格。
安装成功。

npm install webpack-dev-server html-webpack-plugin --save -dev

图片.png
安装失败，因为html后面多了1个空格。html -webpack。应该是html-webpack。
npm install webpack-dev-server html -webpack-plugin --save -dev
图片.png

也可以分开安装：
npm install webpack-dev-server --save-dev
npm i --save-dev html-webpack-plugin

安装：
npm install babel-core babel-loader babel-polyfill babel-preset-es2015 babel-preset-latest --save-dev

图片.png