关于 Vue/React 的 cli 中运用 webpack 打包的原理简单解析

webpack、webpack-cli的打包        

关于 webpack 对前端工程中进行资源文件进行打包处理的过程中，运用到的核心插件主要是 webpack 和 webpack-cli，在 react 和 vue 对于打包各自工程中的 cli 则是进行了自定义的构建，专门用于项目打包的 cli。可简单的进行自定义运行 webpack 的编译运行文件。例如：

通过 webpack-cli 运用 webpack 进行文件资源打包压缩处理，执行script 中的脚本命令后,webpack-cli 会自动编译解析工程中的 webpack.config.js 文件，运用 webpack 对文件进行打包。

自定义编译运行文件进行打包的简单实现

引入 webpack.config.js 文件，通过webpack 去加载 webpack.config.js 文件，会创建一个compiler对象，里面内置了 run方法即可对 webpack.config.js 文件进行编译运行

build.js

const webpack = require('webpack')
const config = require('./webpack.config')

const compiler = webpack(config)
compiler.run((err, stats) => {
  if(err) {
    console.error(err)
  } else {
    console.log(stats);
    
  }
})

命令行中通过 node 命令执行该文件即可实现运用 webpack 对资源文件进行打包。