@fch/fch-cli

fch-cli

起步

安装

npm i -g @fch/fch-cli

创建新项目

fch new|n [options] [name]

fch.json 务必保证当前的project是有的

{
    "collection": "@fch/fch-react-schematic", -- 生成过程用的子schematics
    "type": "web", -- 当前的项目类型 web 和 h5 暂时支持
    "defaultSrcRoot": "/src/solution/", -- 最好不要更改当前的作用路径
    "needRouter": [ -- 哪些生成命令需要额外添加路由注入
        "c"
    ],
    "needDto": [  -- 哪些生成命令需要同时生成dto文件
        "s"
    ],
    "baseUrl": {  -- 设置service、dto、inerface文件夹所在路径
      "service": "/src/solution/model/services",
      "dto": "/src/solution/model/dto",
      "interface": "/src/shared/interface"
    }
}

options 可选参数

• -d 只能看到生成的目录结构和文件，不会真的生成文件
• -s 跳过安装node_modules

eg.

fch new my-project 可选h5 和 web
# OR
fch n my-project

使用

快速生成文件至当前目录

fch generate|g <schematic> [name]

schematic 可选参数

• c: 生成hooks组件

  fch g c <your-component-name>
  

• rc: 生成带有reducer的组件

  fch g rc <your-component-name>
  

• s: 生成请求的service文件

  fch g s <your-service-name>
  

• d: 生成相应dto文件

  fch g d <your-dto-name>
  

• m: 生成相应module模板文件

  fch g m <your-module-name>
  

• table: 生成相应component table模板文件

  fch g table <your-table-name>
  

• modal: 生成相应modal模板文件

  fch g modal <your-modal-name>
  

webpack功能

配置

在使用webpack打包构建功能的时候必须保证项目根目录中包含fch.json和fch.webpack.config.js ,两个配置文件文件以及环境变量配置文件。

• fch.json 中的 type 属性用于区分打包目标为 web 还是 h5

• fch.webpack.config.js 用于配置用户自定义的webpack选项

  目前只是开放了少数配置，后期陆续增加用户可修改的范围，如果用户不配置这个文件，那么webpack会根据预设的配置进行打包

  • entry
  • output
    • publicPath
    • filename
    • path
    • libary
    • libaryTarget
  • plugins
    • html-webpack-plugin

const path = require('path')
module.exports = {
    entry: {
        index: './src/index.tsx',
        indexSimple: './src/index.simple.tsx'
    },
    plugins: [
        {
            plugin: 'html-webpack-plugin',
            option: {
                template: process.argv[2] == '--build' ? path.resolve(__dirname, './public/index.html') : path.resolve(__dirname, './public/indexMap.html'),
                title: '风控三期',
                chunks: ['index']
            }
        },
        {
            plugin:'html-webpack-plugin',
            option: {
                filename: 'user-action-report-component.html',
                template: path.resolve(__dirname, './public/index.simple.html'),
                title: '今日用车报告',
                chunks: ['indexSimple']
            }
        }
    ]
}

使用

在根目录的 package.json 中加入如下配置，然后执行。

"fch:start": "fch start",
"fch:build": "fch build"