npm | webpack v4 简介和入门

这里是 webpack 的简单入门。

你也可以使用

webpack --help

创建项目

# 创建目录并且进入
mkdir webpack && cd $_
# 初始化
npm init -y
# 安装 webpack 和 webpack-cli到开发依赖
npm i webpack@4 --save-dev
npm i webpack-cli@3 --save-dev

然后我们使用 ES6 语言进行转换，安装如下:

npm i @babel/core babel-loader @babel/preset-env --save-dev

关于这个库，可以看

• babel

package.json

内容是

{
  "name": "webpack-test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "webpack --mode development --entry ./src/index.js --module-bind js=babel-loader --output ./dist/main.js",
    "build": "webpack --mode production --entry ./src/index.js --module-bind js=babel-loader --output ./dist/main.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.12.10",
    "@babel/preset-env": "^7.12.11",
    "babel-loader": "^8.2.2"
  },
  "dependencies": {
    "webpack": "^4.44.2",
    "webpack-cli": "^3.3.12"
  }
}