@qse/edu-scripts 1.14.18 → 2.0.0

package/docs/deploy.md

@@ -1,54 +0,0 @@
-# 部署 v1
-
-项目使用 [@qse/ssh-sftp][1] 部署代码到 v1 环境
-
-## 教育模式
-
-支持 局端/校端/公文 部署。无需额外的配置即可使用
-
-```bash
-# 局端
-npx edu-scripts deploy -b
-
-# 校端
-npx edu-scripts deploy -s
-
-# 公文
-npx edu-scripts deploy -d
-```
-
-## 独立模式
-
-### 默认部署
-
-默认会部署到 `/qsxxwapdev/${package.name}` 路径下
-
-```bash
-npx edu-scripts deploy
-```
-
-### 自定义部署
-
-自定义配置部署路径
-
-```bash
-# 生成配置文件
-npx ssh-sftp init
-```
-
-编辑配置文件
-
-```json
-{
-  "$schema": "http://www.zhidianbao.cn:8088/qsxxwapdev/edu-ssh-sftp/sftprc.schema.json",
-  "preset": {
-    "context": "qsxxwapdev"
-  }
-}
-```
-
-可以使用预设配置，`npx ssh-sftp show-config` 查看最终的配置
-
-其余配置请看 [@qse/ssh-sftp][1]
-
-[1]: http://www.zhidianbao.cn:8088/qsxxwapdev/edu-ssh-sftp/

package/docs/faq.md

@@ -1,144 +0,0 @@
-# 错误处理
-
-## moment 没有 external 掉
-
-全局搜索 `moment/locale/zh-cn`，把这些引入都删除掉即可
-
-## ueditor 提示 css 文件加载不到
-
-移动 `src/ueditor` 到 `public/ueditor`, 导入地址也修改下
-
-例子: `require('../../../public/ueditor/<something>')`
-
-## style 文件报错
-
-```js
-import * as style from './index.less'
-//=> 改成
-import style from './index.less'
-```
-
-## 如果判断是缺少 `alias` 配置，使用 `npx edu-scripts g override` 生成配置文件，并且配置 `alias` 参数
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-const path = require('path')
-
-module.exports = defineConfig({
-  alias: {
-    pages: path.resolve('src/pages'),
-  },
-})
-```
-
-## 动态导入 `import`，webpack4 以后 `import` 默认导出改成 `default`
-
-```js
-// 以前写法
-import('lodash/get').then((get) => {
-  get()
-})
-
-// 现在写法
-import('lodash/get').then(({ default: get }) => {
-  get()
-})
-```
-
-## `react` 组件热更新失效
-
-把上面的 `CDN` 加入到首页(index\*.html)中
-
-其中 `process.env.NODE_ENV` 那段代码是关键
-
-热更新需要 react16，请阅读[升级指南](/refactor-react-16)
-
-## 主文件过大，代码分割失效
-
-检查是否有 `require('./chunkfile').default` 这种写法，这会导致代码分割失效，直接打进 main 中
-
-```js
-export default (callback) => {
-  require.ensure([], (require) => {
-    // 错误例子
-    callback(require('./chunkfile').default)
-
-    // 正确写法
-    const mod = require('./chunkfile')
-    callback(mod.default)
-  })
-}
-```
-
-另外，webpack2 开始就不推荐使用 `require.ensure` 做代码分割了。现在可以使用 `import` 方式代码分割
-
-```js
-export default (callback) => {
-  import(/* webpackChunkName: 'chunkfileName' */ './chunkfile').then((mod) => {
-    callback(mod.default)
-  })
-}
-```
-
-## 子工程不能含有 public/static，现已自动删除
-
-子工程不能含有 static 是因为 新建子工程 如果拷贝了主工程代码，那 static 也复制了，打包部署 v1 后可能会覆盖主工程的 static。而且子工程本身就不应该有 static，不可以引入本地外部资源
-
-## qsbAntd is not defiend
-
-子工程项目如果出现这个错误，引入下面的静态资源
-
-```html
-<!-- 确保已经引入 react moment antd -->
-<script src="//www.zhidianbao.cn:8088/qsxxwapdev/edu-scripts/react-dev-preset.js"></script>
-<script src="//www.zhidianbao.cn:8088/qsxxwapdev/edu-scripts/moment2.29.1.js"></script>
-<script src="//www.zhidianbao.cn:8088/qsxxwapdev/edu-scripts/antd3.26.20.js"></script>
-
-<!-- 引入 @qsb/antd -->
-<script src="//www.zhidianbao.cn:8088/qsxxwapdev/edu-scripts/qsb-antd.min.js"></script>
-```
-
-## 钉钉遇到页面打开白屏
-
-这种情况多半是链接中带了 hash，导致页面跳转失败。（复制出来可能是新的链接，但页面其实是老的并未跳转）
-
-将下面两段代码分别加入对应的文件中，必须保证其位置在所有 `script` 最前面
-
-原理： 将 hash 转存至 localStorage，跳转后再取出
-
-```html
-<!-- index.html -->
-<script>
-  ;(function () {
-    var searchString = location.search
-    if (!/(\?|&)S=/.test(searchString)) {
-      var randomHexString = Math.random().toString(32).substring(2)
-      searchString = searchString.substring(1)
-      searchString = '?S=' + randomHexString + (searchString.length > 0 ? '&' + searchString : '')
-    }
-    if (location.hash) {
-      localStorage.setItem('qse:H', location.hash)
-    }
-    var pathnameArr = location.pathname.split('/')
-    var pathname = pathnameArr.slice(0, -1).concat('index1.html').join('/')
-    var __tmp_URL = location.origin + pathname + searchString
-    history.replaceState(null, document.title, __tmp_URL)
-    location.reload()
-  })()
-</script>
-```
-
-```html
-<!-- index1.html -->
-<script>
-  ;(function () {
-    var hash = localStorage.getItem('qse:H')
-    if (hash) {
-      localStorage.removeItem('qse:H')
-      hash = /^#/.test(hash) ? hash : '#' + hash
-      var url = location.origin + location.pathname + location.search + hash
-      history.replaceState(history.state, null, url)
-    }
-  })()
-</script>
-```

package/docs/feat.md

@@ -1,167 +0,0 @@
-# 特性
-
-## svg 模块导出
-
-默认导出 `dataURI`，额外导出 `ReactComponent`
-
-两种使用方式是相同的
-
-```tsx | pure
-import logoURI, { ReactComponent as Logo } from './logo.svg'
-
-export default () => (
-  <>
-    <img src={logoURI} />
-    <Logo />
-  </>
-)
-```
-
-## 复制 public 文件
-
-`edu-scripts build` 会复制 `public` 或 `public/static` 文件到 `dist` 中
-
-教育子工程不会复制
-
-## 支持 typescript
-
-如果要开启 typescrit，只需要运行 `npx edu g ts`
-
-## 生成页面模版
-
-可以自动生成页面模版
-
-运行 `npx edu g page -h` 查看详细信息
-
-## 支持[自定义配置](override.md)
-
-运行 `npx edu g override` 生成控制文件
-
-## 自动根据 qsb 的 CDN 调整内部配置
-
-根据 `public/*.html` 文件里的 CDN 按需自动配置 externals 与 dll
-
-### CDN 匹配关键字
-
-`/react16.14.*_common31?.js/`
-
-- external: `react`, `react-dom`, `natty-fetch`, `natty-store`, `common-utils`
-- 添加内置的 dll 文件
-
-`/react16.14.*_axios0.21.1/`
-
-- external: `react`, `react-dom`, `natty-fetch`, `natty-store`, `common-utils`, `axios`
-
-`moment2.29.1.js`
-
-- external: `moment`
-
-`antd3.26.20.js`
-
-- external: `react`, `react-dom`, `moment`, `antd`
-
-如果使用 `antd3.26.20.js` 将额外执行下列规则
-
-`qsb-antd.min.js`
-
-- external: `@qsb/antd`, `@qse/antd`
-
-`qsb-scheme-render.min.js`
-
-- external: `@qsb/scheme-render` `@qse/scheme-render`
-
-## 支持 tailwindcss
-
-如果要开启 tailwindcss，只需要运行 `npx edu g tailwind`
-
-## PostCSS
-
-预处理很多样式[兼容性问题](https://preset-env.cssdb.org/features/#stage-2)
-
-为所有 `overflow: auto/scroll` 自动增加 `-webkit-overflow-scrolling: touch`
-
-为所有 `env(safe-area-inset-*)` 增加 fallback
-
-## Mock
-
-项目内建 mock 服务器，支持热更新，可以在 development 环境下使用
-
-mock 功能会根据 mock 文件夹自动判断是否开启
-
-可以通过 override.config.js 文件配置 mock 参数关闭该功能
-
-### 使用步骤
-
-根目录创建 mock 文件夹，在该文件夹下创建的所有 js、ts 文件都会被自动加载，可以创建多层级文件夹
-
-```js
-// path: /mock/index.js
-// path: /mock/depth/folder/index.js 支持深层文件
-
-import { defineMock } from '@qse/edu-scripts'
-
-export default defineMock({
-  'GET /api/test/test': { hello: 'world' },
-  'GET /api/test/test2': [1, 2, 3],
-  'POST /api/test2/test': (req, res) => {
-    console.log(req.body, req.cookies)
-    res.json({ foo: 'bar' })
-  },
-})
-```
-
-### mock 规则
-
-```ts
-import type { RequestHandler } from 'express'
-type Method = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH' | 'HEAD' | 'OPTIONS' | 'CONNECT' | 'TRACE'
-type API = string
-
-export type MockConfig = Record<
-  `${Method} ${API}`,
-  string | number | null | undefined | boolean | Record<string, any> | RequestHandler
->
-
-export function defineMock(config: MockConfig) {
-  return config
-}
-```
-
-mock 名称是由 method 和 apiUrl 组成的，按这种规则去匹配
-
-所有 mock 文件最终会被合并到一起，形成一个大的对象。**所以当出现同名的 mock，前面的会被后面的覆盖**
-
-可以通过下面的方式去获取参数
-
-- `req.body` 获取 body 参数
-- `req.query` 获取链接上的参数
-- `req.cookies` 获取 cookies
-
-<Alert>mock 规则比 proxy 具有更高的优先级，如果匹配中了 mock，就会不再去 proxy 了</Alert>
-
-```ts
-// path: /mock/index.ts
-import Mock from 'mockjs'
-
-export default {
-  // method 必须是大写。可以直接返回数据
-  'GET /api/test': { hello: 'world' },
-
-  // 可以通过 express.requestHandler 处理请求。能实现自定义内容，发送文件等
-  'POST /api/test2': (req, res) => {
-    // 例如：将 body 内容返回
-    res.json(req.body)
-  },
-
-  // 可以通过第三方库生成 mock 数据
-  'POST /api/test3': Mock.mock({
-    // 属性 list 的值是一个数组，其中含有 1 到 10 个元素
-    'list|1-10': [
-      {
-        // 属性 id 是一个自增数，起始值为 1，每次增 1
-        'id|+1': 1,
-      },
-    ],
-  }),
-}
-```

package/docs/grayscale.md

@@ -1,31 +0,0 @@
-# 灰度测试
-
-## 开启灰度测试
-
-### PC 端
-
-前端只要在 `package.json` 文件中加入 `grayscale` 字段即可
-
-```json
-{
-  "name": "模块名称",
-  "edu": { "grayscale": true }
-}
-```
-
-此时打包出来的模块就成了灰度测试用的模块，会部署到指定的目录下，主工程会处理调度问题
-
-模块名称可与运维讨论
-
-后端接口会由 `nginx` 处理，前端不需要关注
-
-### H5 端
-
-h5 与 pc 是完全不同的方案，前端是需要将代码部署到两个地方。
-
-`/project-name` 与 `/beta_project-name`。第二个名字需要去问运维要
-
-#### 流程
-
-1. 访问 `/qsxxwapdev/project-name/index.html`
-2. 网关拦截 `index.html` 请求，并根据后台灰度配置进行分流，分别进入`/qsxxwapdev/project-name/index1.html` 与 `/qsxxwapdev/beta_project-name/index1.html`

package/docs/index.md

@@ -1,5 +0,0 @@
----
-title: 教育工程化基础框架
----
-
-<embed src="../README.md" />

package/docs/mode.md

@@ -1,42 +0,0 @@
-# 模式
-
-目前有三种模式：教育主工程模式，教育子工程模式，独立模式
-
-## 教育子工程模式
-
-默认情况下使用**教育子工程模式**，无需配置
-
-## 教育主工程模式
-
-### 启用
-
-package.json 增加 mode 字段
-
-```json
-{
-  "edu": { "mode": "main" }
-}
-```
-
-## 独立项目模式
-
-### 启用
-
-package.json 增加 mode 字段
-
-```json
-{
-  "edu": { "mode": "single" }
-}
-```
-
-## 共同
-
-请查看[特性](feat.md)
-
-## 差异
-
-| 差异点                 | 子工程                                   | 主工程                                        | 独立                                                                                    |
-| ---------------------- | ---------------------------------------- | --------------------------------------------- | --------------------------------------------------------------------------------------- |
-| 打包 build             | 不复制 `public`，不导出 `html` 文件      | 复制 `public/static` 文件夹，导出 `html` 文件 | 复制 `public` 文件夹，导出 `html` 文件，且输出的 `output.filename` 会添加 `contenthash` |
-| [部署 deploy](deploy.md) | 只上传 `dist/js、dist/images` 两个文件夹 | 上传 `dist`                                   | 同主工程                                                                                |

package/docs/override.md

@@ -1,193 +0,0 @@
-# 自定义配置
-
-使用 `npx edu g override` 自动生成配置文件，修改 `webpack` 配置
-
-## 类型
-
-```ts
-export type Config = {
-  webpack?: (config: Configuration) => Configuration | undefined
-  devServer?: (config: DevServerConfiguration) => DevServerConfiguration | undefined
-  babel?: (config: any, type: 'src' | 'node_modules') => any | undefined
-  /**
-   * webpack alias 配置，会与内置 alias 合并
-   *
-   * @default
-   * { '@': 'src' }
-   */
-  alias?: Record<string, string>
-  /**
-   * webpack externals 配置，会与内置 externals 合并
-   */
-  externals?: Record<string, string>
-  /**
-   * terser pure_funcs 配置，传 [] 可以不清空 console.log
-   * @default ['console.log']
-   */
-  pure_funcs?: string[]
-  /**
-   * 编译 node_modules 下文件
-   *
-   * 仅在 development 环境下生效。production 一定会编译 node_modules
-   * @default true
-   */
-  transformNodeModules?: boolean
-  /**
-   * 指定压缩工具，esbuild 比 terser 快 20-40 倍，实际压缩率差 10%左右
-   *
-   * @default 'esbuild'
-   */
-  minify?: boolean | 'terser' | 'esbuild'
-  /** 自定义全局参数 */
-  define?: Record<string, any>
-  /** webpack-dev-server proxy
-   *
-   * @default /api -> /qsxxwapdev/api
-   */
-  proxy?: ProxyConfigArray
-  extraPostCSSPlugins?: any[]
-  /**
-   * 开启 mock 功能，会自动加载 mock 文件夹下的文件
-   *
-   * 默认情况下自动判断根目录是否存在 mock 文件夹，如果存在则开启 mock 功能。
-   * 如果设置 false，会关闭 mock 功能
-   */
-  mock?: boolean
-}
-```
-
-## 经典用例
-
-### 增加 alias
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-const path = require('path')
-
-module.exports = defineConfig({
-  alias: {
-    config: path.resolve(__dirname, 'src/config'),
-  },
-})
-```
-
-### 保留 `console.log`
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-
-module.exports = defineConfig({
-  pure_funcs: [],
-})
-```
-
-### 增加 proxy 代理
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-
-module.exports = defineConfig({
-  proxy: [
-    {
-      context: ['/api/cadre_info'],
-      target: 'http://www.zhidianbao.cn:8088/qs_ymm/standard_api_work',
-      changeOrigin: true,
-      headers: {
-        origin: 'http://www.zhidianbao.cn',
-        host: 'www.zhidianbao.cn',
-      },
-    },
-  ],
-})
-```
-
-### 为 antd-mobile 增加 pxtorem 插件
-
-适用范围：antd-mobile@2, antd-mobile@5
-
-安装公司内专用的 pxtorem 插件，比原版增加了 include 与 CSS 变量 编译。并且修改默认值 `1rem === 10px`
-
-```bash
-npm i @qse/postcss-pxtorem
-```
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-const pxtorem = require('@qse/postcss-pxtorem')
-
-module.exports = defineConfig({
-  extraPostCSSPlugins: [pxtorem({ include: ['antd-mobile'] })],
-})
-```
-
-> 可选：添加动态计算 html rem 值
-
-```html
-<script>
-  ;(function (designWidth, base, max) {
-    var docEl = document.documentElement
-    var metaEl = document.querySelector('meta[name="viewport"]')
-
-    var resize = function () {
-      var maxFontSize = Infinity
-      if (max) {
-        var scale = 1
-        var match = metaEl.getAttribute('content').match(/initial\-scale=([\d\.]+)/)
-        var isMobile = /iphone|ipad|ipod|Windows Phone|android/i.test(navigator.userAgent)
-        if (match && isMobile) {
-          scale = parseFloat(match[1])
-        }
-        maxFontSize = max / scale
-      }
-
-      var clientWidth = docEl.clientWidth ? docEl.clientWidth : docEl.getBoundingClientRect().width
-
-      docEl.style.setProperty(
-        'font-size',
-        Math.min((clientWidth / designWidth) * base, maxFontSize) + 'px',
-        'important'
-      )
-    }
-    resize()
-    window.addEventListener('resize', resize)
-  })(375, 16, 16)
-</script>
-```
-
-### 为 antd-mobile@2 增加按需加载
-
-只能给 antd-mobile@2 使用。antd-mobile@5 自带 tree shake 不需要配置
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-
-module.exports = defineConfig({
-  babel(config) {
-    config.plugins.push(['import', { libraryName: 'antd-mobile', style: true }, 'antd-mobile'])
-  },
-})
-```
-
-### 兼容 antd-mobile@1
-
-安装 `svg-sprite-loader` 模块，复制下面的代码
-
-```shell
-npm i svg-sprite-loader
-```
-
-```js
-const { defineConfig } = require('@qse/edu-scripts')
-module.exports = defineConfig({
-  webpack(config) {
-    config.module.rules[0].oneOf.unshift({
-      test: /\.svg$/,
-      loader: 'svg-sprite-loader',
-      options: {
-        esModule: false,
-        runtimeCompat: true,
-      },
-    })
-  },
-})
-```

package/docs/refactor-react-16.md

@@ -1,37 +0,0 @@
-# 升级 react16
-
-frame 项目 react15 升级 react16 指南
-
-## 事前准备
-
-准备适配 common3 的 frame 与 utils
-
-- pc: [pc-frame-utils.zip](http://www.zhidianbao.cn:8088/qsxxwapdev/edu-scripts/pc-frame-utils.zip)
-- h5: [h5-frame-utils.zip](http://www.zhidianbao.cn:8088/qsxxwapdev/edu-scripts/h5-frame-utils.zip)
-
-## 开始升级
-
-1. 先提交所有内容至svn，方便回退
-2. 解压下载的文件，将 frame 与 utils 放到对应目录
-3. 修改 html 文件中 frame 与 utils 的版本号，引入正确的资源
-4. 替换 CDN 资源 
-
-```html
-<script src="//static.qsepay.net/lib/react15.4.1_fastclick1.0.6_natty-storage2.0.2-fetch2.4.2_common2.js"></script>
-
-将上面这条 CDN 替换成下面这条
-
-<script src="//static.qsepay.net/lib/react16.14_fastclick1.0.6_natty-storage2.0.2-fetch2.4.2_axios0.21.1_common31.js"></script>
-```
-
-5. 运行项目看看效果
-
-## 错误处理
-
-### refast LogicRender 缺失
-
-删除全部的 `LogicRender`，使用*三元表达式*处理
-
-### prop-types 缺失
-
-react16 将 prop-types 独立了出去，请下载 prop-types 包，修改导入