首先一個(gè)最基礎(chǔ)的webpack打包目錄結(jié)構(gòu)為:
├── dist
├── node_modules
├── package-lock.json
├── package.json
├── public
├── src
├── webpack.base.js
├── webpack.dev.js
└── webpack.prod.js
執(zhí)行的腳本為
開發(fā)階段
mkdir xxx
cd xxx
npm init
npm i webpack webpack-cli -D
npm i html-webpack-plugin -D
npm i webpack-merge -D
生產(chǎn)階段
npm i clean-webpack-plugin -D
babel-編譯器
為什么core-js要安裝在dependencies
因?yàn)閏ore-js是用來按需加載
@babel/core
babel7之前都是 babel-xxx系宫,7之后為@babel/xxx
babel/core的作用主要是將js轉(zhuǎn)化為AST語法樹复濒,方便各個(gè)插件分析語法進(jìn)行相應(yīng)的處理
舉個(gè)??
@babel/preset-env
結(jié)合browserslist、自身配置去實(shí)現(xiàn)按需加載
npm i babel-loader -D
npm i @babel/core @babel/preset-env -D
npm i core-js -s