1. 创建基本的webpack4.X项目
- 运行
npm init y
快速初始化项目 - 在项目根目录下创建
src
源代码目录和dist
产品目录 - 在
src
目录下创建index.html
- 使用
npm
安装webpack
,运行npm i webpack webpack-cli -D
- 全局运行
npm i cnpm -g
安装cnpm
- 全局运行
- 注意:webpack4.X提供了预定大于配置的概念;目的是为了减少配置
- 默认约定了
- 打包入口文件是
src
->index.js
- 打包输出文件
dist
->main.js
- 4.X中新增了
mode
选项,可选值为development(开发环境打包后不压缩)
和`production(生产环境打包后会压缩)
- 打包入口文件是
- 默认约定了
2. 在项目中使用react
-
运行
npm i react react-dom -S
安装包- react:创建组件、虚拟DOM元素、生命周期
- react-dom:把创建好的组件和虚拟DOM放到页面展示
-
在
index.html
页面中,创建容器<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible