Webpack 知识

初始化 nodejs npm 环境

cd 目录

npm init

这样就可以在指定的目录下使用 npm 指令了

作为开发环境的依赖包添加到 package.json 文件中

npm i webpack webpack-cli -D

执行打包指令（不使用 webpack.config.js 时）

# 开发环境：
webpack --entry ./src/index.js -o ./build --mode=development
# 生产环境：
webpack --entry ./src/index.js -o ./build --mode=production

在 nodejs 环境下测试运行打包后生成的 ./build/main.js 文件

node .\build\main.js

webpack 默认只认识 js 文件，对于 css/img 等其他文件在打包时，要用不同的加载器来处理

例如：index.css 文件，需要使用 css-loader style-loader 来处理，这时候就需要在开发环境依赖中安装这两个插件。

npm i css-loader style-loader -D

使用 webpack.config.js 配置打包的设置后，运行打包指令

webpack