fix: 修复生产环境下未禁用 react-devtools 的问题 (#1411)

* fix: 修复 prod 模式下未禁用 react-devtools 的问题

closed #1408

* chore: type devtools

* docs: 增加 remax-cli 文档

* docs: cli

.gitignore

@@ -77,3 +77,5 @@ remax.iml
 tsconfig.tsbuildinfo
 cjs
 esm
+
+.umi/

docs/api/remax-one/lifecycle.md

@@ -2,6 +2,7 @@
 title: 生命周期
 group:
  title: remax/one
+ order: 2
 ---
 
 在这里列出的生命周期，表示在 `remax/one` 支持的平台中都可以使用，并尽量保证了行为一致。

docs/guide/basic/cli.md

@@ -0,0 +1,60 @@
+---
+title: CLI 命令行
+order: 32
+---
+
+## $ remax build
+
+编译项目，生成构建产物，存放在 `dist/${target}` 目录下。
+
+```bash
+remax build
+
+编译项目
+
+选项：
+ --version 显示版本号 [布尔]
+ --help 显示帮助信息 [布尔]
+ -w, --watch 监听文件变化 [布尔] [默认值: false]
+ -t, --target 目标平台 [字符串] [默认值: "ali"]
+ -n, --notify 编译错误提醒 [布尔] [默认值: false]
+ -p, --port 指定端口号 [数字]
+ -m, --minimize 最小化文件 [布尔] [默认值: false]
+ -a, --analyze 编译分析 [布尔] [默认值: false]
+ -d, --devtools 启动 react-devtools 调试 [布尔] [默认值: true]
+```
+
+### --target
+
+目标平台，支持选项：
+
+- `ali` 支付宝小程序
+- `toutiao` 头条小程序
+- `wechat` 微信小程序
+- `web` web 浏览器
+
+### --watch
+
+监听文件变化实时构建，调试模式开启。
+
+### --notify
+
+编译错误提醒，启用后则在构建错误时推送系统消息。
+
+### --port
+
+指定端口号, `--target=web` 模式下有效。
+
+## --minimize
+
+最小化构建产物，`--watch` 模式下默认不压缩文件以保证快速的响应文件变更，如需在开发模式进行真机调试（压缩文件），可以使用　`--minimize` 或 `-m` 参数开启，会增加整体构建时间，请酌情使用。
+
+> minimize 压缩不等同于生产模式！ 在 wechat 平台上使用 --minimize 参数预览时，需要在开发工具 IDE 本地设置中关闭"上传代码压缩混淆"选项，否则 Webpack 和 IDE 的双重压缩会导致编译器无法解析语法而报错。
+
+## --analyze
+
+[编译分析](https://www.npmjs.com/package/webpack-bundle-analyzer)，开启后可分析构建产物的具体内容组成。
+
+## --devtools
+
+启动 react-devtools 调试模式，详见[调试工具](/guide/basic/devtools)介绍，开发环境下默认开启，如需关闭，可使用参数 `--no-devtools` 强制关闭。

packages/remax-cli/src/builtinPlugins.ts

@@ -8,13 +8,14 @@ export const builtinPlugins = (
  optionKey: string;
  init: (...args: any[]) => Plugin;
 }> => {
+ const isDev = process.env.NODE_ENV !== 'production';
  const plugins = [
  {
  optionKey: 'errorScreen',
  init: errorScreen,
  },
  ];
- if (options.target !== Platform.web) {
+ if (options.target !== Platform.web && isDev && options.devtools) {
  plugins.push({
  optionKey: 'devtools',
  init: devtools,

packages/remax-cli/src/index.ts

@@ -69,6 +69,12 @@ export default class RemaxCLI {
  alias: 'a',
  type: 'boolean',
  default: false,
+ })
+ .option('devtools', {
+ describe: '启动 react-devtools 调试',
+ alias: 'd',
+ type: 'boolean',
+ default: true,
  });
  },
  (argv: any) => {

packages/remax-types/src/index.ts

@@ -44,6 +44,7 @@ export interface BuildOptions {
  watch?: boolean;
  target?: Platform;
  analyze?: boolean;
+ devtools?: boolean;
  type?: BuildType;
  component?: any;
  web?: WebOptions;