1. 创建一个文件夹 这个文件夹 用来使用 webpack 的 
  •          npm  init - y  初始化文件
  •          引入   webpack webapck-cli     
                      如: yarn  add  webpack webapck-cli -D
  •         新建src目录 mkdir src
                   
                   创建 index.js  a.js  b.js
                   index.js  引用 a.js  a.js  引用 b.js
 
                   index.js
                  
        
let str = require('./a.js')
console.log(str)

 

 
                  a.js
let b = require('./base/b.js')
module.exports = b + '2020'

 

           
               b.js
module.exports = '您好'

 

 
  •    创建 webpack.config.js 进行配置
            
let path = require('path');
module.exports = {
  mode: 'development',
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  }
}
 

 

  • 运行项目   命令行运行 npm webpack  运行成功入下
 
 
2..创建属于我们自己的webpack 命令
  
  •    创建目录
             mkdir  my-pack
  •    初始化
            npm  init -y
  •   在项目跟目录下 创建 bin 文件夹 bin 文件夹下创建  my-pack.js
  •  添加运行环境为  node
            
#! /usr/bin/env node
console.log('2020')
  •    在node  里面想配置面向工具  可以在 package.json 添加bin  属性
{
  "name": "my-webpack",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "bin": {
    "my-pack": "./bin/my-pack.js"
  }
}
  1. 将创建的包  链接到 全局上 在我们需要的项目使用 这个打包工具
  •      进去到创建的npx 命令的目录 下  cd  my-webpack
  •      执行link     link 
  •      进去到使用目录  cd webpack-dev
  •     把刚才npm link到全局的命令npx m-pick 再link到本地中使用
           
npm  link m-pack
 
        
演示:
 
 链接  :https://app.yinxiang.com/fx/48d668d2-ec17-4087-a41b-51dc9dc1ea63
 
代码演示:
 
越努力越幸运