Webpack的安装及基本使用方法

1webpack的安装

在安装webpack之前，先安装一个nrm,nrm可以提供多种webpack的安装路径
安装nrm
安装nrm命令

$npm i nrm -g  //全局安装nrm

显示相关的安装路径命令

$nrm -ls

如果想用某种方式进行安装，可用如下命令进行方式的切换
nrm use 方式
例如这里想用淘宝的方式进行安装

$nrm use taobao

安装webpack
安装好nrm 了就开始安装webpack,这里有两种方式进行webpack安装
1全局安装webpack

$npm i webpack -g

2,在项目依赖项中进行安装

$npm i webpack  --save --dev

新建一个项目
新建如下项目

首先运行命令

$npm init -y

npm init 用来初始化生成一个新的 package.json 文件。它会向用户提问一系列问题，如果你觉得不用修改默认配置，一路回车就可以了。
如果使用了 -f（代表force）、-y（代表yes），则跳过提问阶段，直接生成一个新的 package.json 文件。
再运行命令来安装一下Jquery

   $ npm i jquery -s

由于ES6 语法过于高级，浏览器无法解析导入的相关包，所以需要使用webpack进行转化一下。

 $  webpack .\src\main.js  .\dist\boundle.js

这执行这条命令的时候可能反复的需要你安装webpack-cli
这事可以在黑窗口里全局安装一下

$npm i webpack-cli -g

接着会因为webpack 版本高了 ，无法安装，这是需要在前前一条命令加 --output

  $ webpack .\src\main.js --output .\dist\boundle.js

如果你的webpack安装的位置和项目的位置不再同一个盘内，就会爆出这样一个错

遇到这个问题可以通过以下命令解决

 $ npm link webpack

就可以解决了
最后在index.html中添加main.js 和boundle.js

 <srcipt src="./main.js"></srcipt>
<srcipt src="../dist/boundle.js"></srcipt>