基本配置

easywebpack 提供了 cdn 配置节点, 只需要配置 cdn 地址即可(cdn地址会覆盖publicPath地址).配置如下:

  • easywebpack3 配置后 dev,test, prod 模式都会生效, 一般通过变量控制 cdn 节点的配置
// ${app_root}/webpack.config.js
module.exports = {
  ......
  cdn:UPLOAD_CDN ? { url: 'http://xxx.cdn.com/public/' }: {},
  done(){
    // upload static file to cdn: http://xxx.cdn.com
  }
}
  • easywebpack4 配置后只有 test, prod 模式都会生效, 所以无需通过环境变量控制
// ${app_root}/webpack.config.js
module.exports = {
  ......
  cdn:'http://xxx.cdn.com',
  done(){
    // upload static file to cdn: http://xxx.cdn.com
  }
}

实战配置

注意:实际项目具体做法一般是只有上线部署才使用 cdn 生效. 我们可以在 Webpack 构建完成后, 在 done 函数里面上传静态资源到 cdn.url 地址.
我们可以通过添加环境变量的方式决定是否需要上传CDN, 从而控制本地开发构建不上传CDN, 只有在CI构建(CI环境里面定义UPLOAD_CDN环境变量)时才触发CDN流程.

// ${app_root}/webpack.config.js
const UPLOAD_CDN = process.env.UPLOAD_CDN;
module.exports = {
  ......
  cdn: 'http://xxx.cdn.com/public/',
  done(){
    // upload static file to cdn: http://xxx.cdn.com
    if(UPLOAD_CDN){

    }
  }
}

打包配置

packjson.json 本地打正式包配置

npm run build 打正式包的时候, 开启 UPLOAD_CDN 开关

{
   "script" :{
      "build:dev": "cross-env easy build dev",
      "build:test": "cross-env easy build test",
      "build": "cross-env UPLOAD_CDN=true easy build prod"
   }
 }

packjson.json CI 打正式包配置

这里无需配置 UPLOAD_CDN 参数, 请在 CI 系统配置 UPLOAD_CDN 环境变量

{
   "script" :{
      "build:dev": "easy build dev",
      "build:test": "easy build test",
      "build": "easy build prod"
   }
 }

Author: sky
Reprint policy: All articles in this blog are used except for special statements CC BY 4.0 reprint polocy. If reproduced, please indicate source sky !
 Previous
deploy deploy
打包配置支持 webpack.config.js 文件配置 和  easyweback-cli 模式,  easywebpack-cli@4.3.2 开始支持。注意打部署包时, 如果把 node 和 alinode 打进依赖包里面,请保证打包机器操作系统与线上运行的操作系统...
2019-12-23 sky
Next 
webpack.config.js webpack.config.js
webpack.config.js
2019-12-23 sky