一个命令行工具

全局安装

$ yarn global add xkc

dev

此命令会先编译出packages包的d.ts文件，再启动webpack-dev-server。

$ xkc dev

build

# 构建 app bundle
$ xkc build

# 构建 package d.ts
$ xkc build:d

# 构建 package
$ xkc build:s

使用proxy

在应用目录下创建proxy.js。配置可参考：https://github.com/chimurai/http-proxy-middleware#readme

使用mock

$ xkc dev --mock

需要在应用目录下创建mock目录，此目录下的js文件将作为mock接口。如：

api.js

module.exports = {
  'GET /api/v2/site-plan-web/xxx': () => ([
    name: 'xxxx',
    updateTime: '2022年03月21日17:45:42'
  ])
}

使用json文件

module.exports = {
  'GET /api/v2/site-plan-web/xxx': require('./data.json')
}

全局变量

app

• app.args - 命令行参数；
• app.paths - 目录配置；

Troubleshoot

• 提示 configuration.resolve has an unknown property 'fallback'. These properties are valid:

删除项目node_modules和prime node_modules下的webpack、react-scripts.

• less 文件模块不存在问题

更新less依赖的文件@import路径：

旧

@import '@xkool/ui/src/styles/variables.less';

新

@import '@xkool/ui/styles/variables.less';

原因是因为webpack alias字段使用了src的资源，如：

{
  '@xkool/ui': '/Users/xkool/Documents/work/Development/frontend-prime/packages/ui/src'
}

所以代码中需要去掉「src」。