一个基于webpack的构建器,用户无需关心webpack配置,通过简单配置即可进行本地调试和线上打包
- 支持 less,postcss,autoprefixer
- 支持 ts
- 支持 react
- 支持 es6 语法
- 开发模式支持 hmr
- 直接接口代理
- 基于 koa 2 版本启动的服务器
yarn global add builder-abc
或者
npm install builder-abc -g
- 项目根目录新增 .abcrc 文件 (必须是严格的 json 格式),大部分的场景下,只需要简单配置,比如:
{
port: 8000
entry: {
'app': './index.js'
},
htmlTemplateUrl: './index.html'
}- �本地开发调试 - 启动调式服务器,启动的服务器默认拥有 hmr 功能
abc dev
- 代码上线阶段 - 执行代码构建
abc build
{
"port": 8080, // 服务器端口配置,默认 8080
"entry": {}, // 入口文件配置,一般需要覆盖配置,比如:entry: { app: './index.js' }
"output": {}, // 输出配置,默认:{ path: './build', filename: '[name].js' }
"rules": [], // loader 配置,配置方式:[{ test: /\.js$/, use: ['babel'] }]
"plugins": [], // 插件配置
"alias": [], // 别名配置,配置方式:{ component: 'xx/xx/component' }
"babelOptions": {}, // babel 选项配置
"isExtractCss": true, // 是否抽离 css 成单独的文件,默认抽离成单独的文件
"htmlTemplateUrl": "", // 页面启动页默认配置,一般需要覆盖配置
"devtool": "eval-source-map", // soucemap 配置,开发模式下使用,默认:eval-source-map
"proxy": {} // 代理设置,比如:{ '/api': 'http://www.aliyun.com/mocks', 'example/:id': (params) => return { target: 'http://localhost:8080/', logs: true } }
}- 指定入口和模板路径,以及设置代理
{
"entry": {
"app": "./src/index.js"
},
"htmlTemplateUrl": "./index.html",
"proxy": {
"/api": "http://www.aliyun.com/mocks"
}
}- libpng issues Installing on some versions of OSX may raise errors with a missing libpng dependency:
Module build failed: Error: dyld: Library not loaded: /usr/local/opt/libpng/lib/libpng16.16.dylib
This can be remedied by installing the newest version of libpng with homebrew:
brew install libpng