打包工具webpack安装使用

安装和使用步骤如下：

1. windows用户的cmd窗口，执行

cd d
mkdir webpack
npm -v
npm init
npm install webpack --save-dev

2. 这边报错了，调查之后使用下面命令解决

npm config set registry https://registry.npm.taobao.org
npm install webpack webpack-dev-server -d -g

3.但是，执行webpack -v查看webpack版本时，出现下面错误：

One CLI for webpack must be installed. These are recommended choices, delivered as separate packages:

• webpack-cli (https://github.com/webpack/webpack-cli)
  The original webpack full-featured CLI.
  We will use “npm” to install the CLI via “npm install -D”.
  Do you want to install ‘webpack-cli’ (yes/no):

解决办法：

npm install webpack-cli -g

4. 确认安装是否成功

webpack -v
4.39.1

5. 在当前文件夹创建hello.js文件，写入下面代码

function hello(){
alert(“hello”);
}

6. 执行下面打包命令

webpack hello.js hello.bundle.js

7.但是报错，The ‘mode’ option has not been set, webpack will fallback
解决办法

webpack hello.js --output-filename hello.bundle.js --output-path .
–mode development

到此查看现在的文件夹，发现多了dist/hello.bundle.js文件，表示打包和安装成功