Day04-Webpack打包js、css文件，html的介绍及常用标签，前端实战开发视频

• 三、初始化项目—Webpack打包js文件

• • 1、首先在vscode工作空间中创建文件夹Webpackdemo

• 2、初始化项目环境，点击Webpackdemo文件夹，在终端中打开。

• 3、创建src文件夹

• 4、src下创建common.js

• 5、src下创建utils.js

• 6、src下创建main.js

• 四、JS打包

• • 1、webpackdemo目录下创建配置文件webpack.config.js

• 2、打包

• • 打包方式一：命令行执行编译命令

• 打包方式二：

• 3、webpackdemo目录下创建index.html

• 4、浏览器中查看index.html

• 五、CSS打包

• • 1、安装style-loader和 css-loader

• 2、修改webpack.config.js

• 3、在src文件夹下创建style.css

• 4、修改main.js

• 5、打包

• 6、浏览器中查看index.html

一、什么是Webpack?

============================================================================

Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。

从图中我们可以看出，Webpack 可以将多种静态资源 js、