@cisdi/pangu

develop tool for ui-engine project

Usage no npm install needed!

<script type="module">
  import cisdiPangu from 'https://cdn.skypack.dev/@cisdi/pangu';
</script>

README

@cisdi/pangu

pangu devtools for ui engine

用法

  • 安装

    npm i @cisdi/pangu --dev
    # 查看帮助
    pangu --help
    
  • 本地开发

    pangu dev
    # 查看帮助
    pangu dev --help
    
  • 打包

    pangu build
    # 查看帮助
    pangu build --help
    

自定义 Webpack 配置

支持两种方式自定义 Webpack 配置

  • 函数式

    // webpack.config.js
    module.exports = function(config) {
      // 修改配置
      return config
    }
    

其中 config 为现有配置

  • 对象式

    // webpack.config.js
    module.exports = {
      // 你的配置
    }
    

    此种方式修改的配置将会被使用 webpack-merge 合并

应用配置

根目录下放置 app.json 来配置应用,目前支持以下配置

{
  "appName": "应用名"
}

字段说明

  • appName: document.title 以及 process.env.APP_NAME

主题配置

根目录放置 theme.json 来配置主题,其原理是根据配置通过 lessmodifyVars 实现

  • 支持通过 extends 继承配置
  • 支持所有 Ant Design 主题配置
{
  "extends": "@ant-design/dark-theme",
  "primary-color": "#1890ff"
}

环境变量

编译时

  • process.env.NODE_ENV: Node 环境: development/production
  • process.env.PORT: 本地开发运行端口
  • process.env.HOST: 本地开发运行地址

运行时

  • process.env.APP_NAME: 应用名
  • process.env.APP_ENV: APP 环境: development===0/test===1/preproduction===2/production===3
  • process.env.NODE_ENV: Node 环境: development/production

Mock Server

基于 json-server

在根目录下创建 mocks/db.json 文件,参考 json-server 配置