init

Author: kaiyu.kong

.dumirc.ts

@@ -0,0 +1,26 @@
+import { defineConfig } from 'dumi';
+
+const logo =
+  'https://imagev2.xmcdn.com/storages/f8d2-audiofreehighqps/81/43/GMCoOSYIO18uAAAvaAIdYbXD.png';
+
+const publicPath =
+  process.env.NODE_ENV === 'production' ? `/cli/create-project/` : '/';
+
+export default defineConfig({
+  themeConfig: {
+    name: 'create-project',
+    logo,
+  },
+  history: {
+    type: 'hash',
+  },
+  hash: true,
+  favicons: [logo],
+  publicPath,
+  alias: {
+    images: '/docs/images',
+  },
+  resolve: {
+    docDirs: ['docs'],
+  },
+});

.editorconfig

@@ -0,0 +1,16 @@
+# http://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[Makefile]
+indent_style = tab

.gitignore

@@ -0,0 +1,25 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+.dumi/tmp
+.dumi/tmp-production
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

.gitlab-ci.yml

@@ -0,0 +1,19 @@
+pages:
+  stage: deploy
+  script:
+    - pwd
+    - ls
+    # 因为，服务器端的 nodejs 版本较低 & fsevents 不兼容 linux（仅仅是 macos 需要而已）
+    # ☞ 设置略过环境检查，保证 gitlab ci 顺利执行
+    - yarn config set ignore-engines true
+    - yarn
+    - yarn build
+    - rm -rf public/*
+    - mkdir .public
+    - cp -r dist/* .public
+    - mv .public public
+  artifacts:
+    paths:
+      - public
+  only:
+    - master

.prettierignore

@@ -0,0 +1,8 @@
+**/*.svg
+**/*.ejs
+**/*.html
+package.json
+docs
+.dumi/tmp
+.dumi/tmp-production
+*.yaml

.prettierrc

@@ -0,0 +1,17 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all",
+  "printWidth": 80,
+  "overrides": [
+    {
+      "files": ".prettierrc",
+      "options": { "parser": "json" }
+    },
+    {
+      "files": "*.md",
+      "options": {
+        "proseWrap": "preserve"
+      }
+    }
+  ]
+}

.yarnrc

@@ -0,0 +1,2 @@
+"@xmly:registry" "http://xnpm.ximalaya.com/"
+"@xmc:registry" "http://xnpm.ximalaya.com/"

README.md

@@ -0,0 +1,28 @@
+## Getting Started
+
+```bash
+npx -p @xmly/create-project create-project
+```
+
+## 下载自定义模版
+
+```bash
+npx -p @xmly/create-project create-project download [模板名称]
+```
+
+## 将项目转换为模版
+
+先进入项目目录，再执行以下命令：
+
+```bash
+npx -p @xmly/create-project create-project transform [模板名]
+
+```
+
+模版存放目录（可选）：
+
+```bash
+npx -p @xmly/create-project create-project transform [模板名] <模版存放目录>
+```
+
+[文档](http://react-library.pages.xmly.work/cli/create-project)

docs/download.md

@@ -0,0 +1,68 @@
+---
+title: 下载模版
+order: 1
+toc: content
+nav:
+  title: 下载模版
+  order: 2
+---
+
+# 下载模版
+
+百分百还原 template 内容，0 改写，极大的降低了心智负担，规避了 create-react-app 下载模版的痛点
+
+下载模版：
+
+```bash
+npx -p @xmly/create-project create-project download [模板名称]
+```
+
+`or`
+
+支持输入项目名称：
+
+```bash
+npx -p @xmly/create-project create-project download [模板名称] [项目名称]
+```
+
+支持下载模版后替换内容：
+
+```bash
+npx -p @xmly/create-project create-project download [模板名称] -r [旧内容] [新内容]
+```
+
+## 要求的模版目录文件
+
+下载的 template 模版内容必须存在以下目录和文件
+
+<Tree>
+  <ul>
+    <li>
+      template
+      <small>模板的文件目录</small>
+      <ul>
+        <li>gitignore <small>注意：gitignore文件没有句号</small></li>
+        <li> ... <small>其他文件</small></li>
+      </ul>
+    </li>
+    <li>package.json</li>
+    <li>README.md <small>可选</small></li>
+    <li>template.json</li>
+  </ul>
+</Tree>
+
+## 使用 create-react-app (CRA)下载 cra-template 模板
+
+```bash
+yarn create react-app [项目名称] --template [模版名称]
+```
+
+:::warning{title=问题}
+使用 create-react-app (CRA)下载 cra-template 模板时，会改写 `tsconfig.json` 中的配置，导致不符合预期，例如：
+
+会删除 `tsconfig.json` 中的路径别名配置
+:::
+
+:::warning{title=下载缓慢}
+下载模版时，同时会安装模版中的所有依赖，导致等待时间较长。安装完成后，才能看到项目的完整目录
+:::

docs/guide/apm.md

@@ -0,0 +1,60 @@
+---
+title: 配置云效参数
+order: 7
+toc: content
+group:
+  title: 基础
+  order: 3
+nav:
+  title: 指南
+  order: 1
+---
+
+# 配置云效参数
+
+云效发布时，需要配置 `Sentry` 和 `apm`
+
+## 配置 Sentry
+
+```ts | pure
+import * as Sentry from '@sentry/react';
+import { name as projectName, version } from '../package.json';
+const { MODE } = import.meta.env;
+
+// Sentry Project ☞ Client Keys DSN
+// https://websentry.ximalaya.com/settings/xmly/projects/
+// 一般在创建云效应用时，会看到自动创建 Sentry Project，可以看到 Client Keys DSN（否则，从上方链接去查找，若未创建可手动创建）
+const CLIENT_KEY = '';
+
+/**
+ * Sentry
+ *  - test/production 均上报，方便提早发现问题。
+ *  - Sentry React: https://docs.sentry.io/platforms/javascript/guides/react/
+ */
+Sentry.init({
+  dsn: CLIENT_KEY, // Client Keys DSN
+  environment: MODE, // 区分上报环境
+  sampleRate: 0.1,
+  release: `${projectName}@${version}`,
+});
+```
+
+## 配置 apm
+
+```ts | pure
+import { apm } from '@xmly/xmrep';
+import { name as projectName } from '../package.json';
+
+// Sentry Project ☞ Client Keys DSN
+// https://websentry.ximalaya.com/settings/xmly/projects/
+// 一般在创建云效应用时，会看到自动创建 Sentry Project，可以看到 Client Keys DSN（否则，从上方链接去查找，若未创建可手动创建）
+const CLIENT_KEY = '';
+
+/**
+ * APM 性能监控
+ *  - https://thoughts.ximalaya.com/workspaces/5d679697f30f8700018aa32f/docs/5eddded3f4c0000001da3558
+ */
+apm.init({
+  name: projectName, // 云效项目名（通常应当与项目名称相同，如不一致，需修改）
+});
+```