webpack入门——安装与Demo

安装    参考地址

npm install --save-dev webpack

npm install --save。如果你在安装一个用于开发环境目的的 package 时（例如，linter, 测试库等），你应该使用 npm install --save-dev

查看webpack和node的版本：

webpack -v  //如果webpack是 v4+ 版本，你还需要安装 CLI        npm install --save-dev webpack-cli

node -v

 

Demo  参考地址

1.在命令行中，(ctrl + R ——>cmd)创建webpack项目文件

mkdir webpack_demo

cd webpack_demo  //切换到项目目录

npm init    //若没有webpack_demo文件夹中没有package.json，就执行这个命令，一路回车，最后一个输入'y',生成该文件

2.新建文件夹src、dist，在dist下新建index.html，src下新建index.js

index.js中内容：document.getElementById('title').innerHTML="hello!!";

执行npx webpack命令，生成打包文件main.js，出现下方提示表示打包成功(Node 8.2/npm 5.2.0 以上版本提供的 npx 命令)

在浏览器中查看，可以用插件live-server

安装命令：npm install --g live-server

live-server  //自动在浏览器中运行html,页面输出‘hello!!’表示打包正确