vue webpak版本 查看_webpack安装配置+常见使用过程（结合vue）

webpack介绍和安装

webpack：前端模块化打包工具

安装webpack需要安装Node.js，Node.js自带软件包管理工具npm

查看自己的node版本：

node -v

全局安装webpack

cnpm install webpack -g

查看webpack版本

webpack --version

局部安装webpack

cnpm install webpack --save-dev

为什么全局安装之后还需要局部安装？

在终端直接执行webpack，使用的是全局webpack

如果在package.json中定义了script，其中包含了webpack命令，那么使用的是局部webpack

webpack基本使用过程

小案例：创建一个webpack目录，在里面创建dist目录和src目录

在src目录中创建mathUtils.js和main.js

mathUtils.js

functionadd(num1, num2){return num1 +num2;

}functionmul(num1, num2){return num1 *num2;

}

module.exports={

add, mul

}

main.js

const {add, mul} = require('./mathUtils.js');

console.log(add(2, 3));

console.log(mul(4, 5));

使用webpack将两个js打包

webpack ./src/main.js ./dist/bundle.js

报错：

ERROR in multi ./src/main.js ./dist/bundle.js

Module not found: Error: Can't resolve './dist/bundle.js' in 'C:Users96579Desktopwebpack'

原因：我的版本是最新的webpack，所以有些命令不一样了

将以上代