我们经常会遇到单独对 JS 打包的场景,比如 es6 写的 npm 包需要构建成 es5 模式. easywebpack 也提供了对应的解决方案: easywebpack-js

基于 easywebpack-js 构建

  • 配置编写
// build/index.js
const easywebpack = require('easywebpack-js');
const config = {
  env: process.env.BUILD_ENV,
  entry: {
    'index': 'lib/index.js'
  }
};
easywebpack.build(config);
  • 命令行配置构建
// ${app_root}/package.json
{
 "scripts": {
   "build:test": "cross-env BUILD_ENV=test NODE_ENV=development node build/index.js",
   "build:prod": "cross-env BUILD_ENV=prod NODE_ENV=production node build/index.js",
 }
}

基于 easywebpack-cli 构建

// ${app_root}/webpack.config.js
const easywebpack = require('easywebpack-js');
module.exports = {
  framework: 'js',
  entry: {
    'index': 'lib/index.js'
  }
};
  • 命令行配置构建
// ${app_root}/package.json
{
 "scripts": {
   "build:test": "easy build test",
   "build:prod": "easy build prod",
 }
}

基于 Webpack 构建

// ${app_root}/webpack.config.js
const easywebpack = require('easywebpack-js');
const config = {
  env: process.env.BUILD_ENV,
  framework: 'js',
  entry: {
    'index': 'lib/index.js'
  }
};
module.exports = easywebpack.getWebpackConfig(config);
  • 命令行配置构建
// ${app_root}/package.json
{
 "scripts": {
   "build:test": "cross-env BUILD_ENV=test webapck --config webpack.config.js",
   "build:prod": "cross-env BUILD_ENV=prod webapck --config webpack.config.js",
 }
}

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
静态页面构建 静态页面构建
nunjucks 模板构建为纯静态页面项目基于 easywebpack-cli 方式构建在用 HTML 模板构建时, 有一个不好的地方就是不能以组件的方式复用, 如是考虑通过渲染模版编译成HTML静态模版. 目前常见的模板引擎有 nunjucks 等渲染模板, 而且社区也有对应的 Webpack loader 支持. 同时 easywebpack-html 也内置支持了, 我们执行只需要打开开关即可.在项目根目录添加 webpack.config.js 文件中启动 nunjucks loader...
2020-04-18 sky
Next 
总体介绍 总体介绍
easywebpack 是什么easywebpack 是基于 webpack 的前端工程化解决方案。旨在解决 webpack 项目构建复杂,使用成本高,复用低,维护成本高等工程效率问题。基于 easywebpack 工程化方案, 你能非常简单容易的对各种前端项目进行工程化建设,及时享受最新的特...
2020-04-18 sky