webpack学习(一):webpack的安装和命令行

时间:2021-12-19 06:14:21

本教程可以学习到如下内容:

1、webpack的安装

2、利用webpack命令打包js文件

3、如何在js文件里面引用css并将css文件在页面里面生效

4、学习webpack相关的高级的一些参数,使我们更清晰的看到webpack打包的过程

假设你已安装了node和npm,且已经建了项目,项目所在的根目录文件夹为webpack-study

一、package.json文件的生成

在命令窗口中敲如下命令,直接按默认回车就好

 npm init 

最后选yes 并生成了package.json文件

二、webpack的安装

1、项目安装(推荐)并在package.json里面建立依赖:

在命令窗口进入项目跟目录,建入如下命令:

npm install --save-dev webpack

2、全局安装(不推荐)

 npm install -g webpack

注意:不推荐全局安装 webpack。这会锁定 webpack 到指定版本,并且在使用不同的 webpack 版本的项目中可能会导致构建失败。

三、利用webpack命令打包js文件

1