From 315b2f926c94695f57355f7acd1fae21471d2b26 Mon Sep 17 00:00:00 2001 From: luhc228 Date: Fri, 2 Sep 2022 10:23:58 +0800 Subject: [PATCH 1/9] docs: init --- website/docs/guide/plugins/store.md | 92 +++++++++++++++++++++++++++++ 1 file changed, 92 insertions(+) create mode 100644 website/docs/guide/plugins/store.md diff --git a/website/docs/guide/plugins/store.md b/website/docs/guide/plugins/store.md new file mode 100644 index 000000000..4a9c36b23 --- /dev/null +++ b/website/docs/guide/plugins/store.md @@ -0,0 +1,92 @@ +--- +title: 状态管理 +order: 2 +--- + +## 开启状态管理 + +安装插件： + +```bash +$ npm i @ice/plugin-store -D +``` + +在 `ice.config.mts` 中添加插件： + +```diff title="ice.config.mts" +import { defineConfig } from '@ice/app'; ++ import store from '@ice/plugin-store'; + +export default defineConfig({ + plugins: [ ++ store(), + ], +}); +``` + +## 全局状态 + +推荐在不同页面组件中使用的状态存放在全局状态中，比如主题、国际化语言、用户信息等。 + +### 定义 Model + +约定在 `src/models` 目录定义全局状态。以定义全局用户状态为例： + +```ts title="src/models/user.ts" +import { createModel } from 'ice'; + +interface User { + name: string, + id: string, +} + +export default createModel({ + // 定义 model 的初始 state + state: { + name: '', + id: '', + } as User, + // 定义改变该模型状态的纯函数 + reducers: { + update(prevState, payload) { + return { + ...prevState, + ...payload, + }; + }, + }, + // 定义处理该模型副作用的函数 + effects: (dispatch) => ({ + async getUserInfo() { + await delay(1000); + this.update({ + name: 'taobao', + id: '123', + }); + }, + }), +}) +``` + +### 初始化 Store + +约定在 `src/store.ts` 中初始化 Store。 + +```ts title="src/store.ts" +import { createStore } from 'ice'; +import user from './models/user'; + +export default createStore({ user }); +``` + +### 在组件中使用 + + + +## 页面状态 + +### 定义 Model + +### 初始化 Store + +### 在组件中使用 From 28e693d9997587ccd1be7abedf6b20bc1a42e105 Mon Sep 17 00:00:00 2001 From: luhc228 Date: Mon, 5 Sep 2022 14:44:31 +0800 Subject: [PATCH 2/9] feat: update store docs --- website/docs/guide/plugins/store.md | 382 +++++++++++++++++++++++++++- 1 file changed, 375 insertions(+), 7 deletions(-) diff --git a/website/docs/guide/plugins/store.md b/website/docs/guide/plugins/store.md index 4a9c36b23..85379e05c 100644 --- a/website/docs/guide/plugins/store.md +++ b/website/docs/guide/plugins/store.md @@ -3,6 +3,9 @@ title: 状态管理 order: 2 --- +import Tabs from '@theme/Tabs'; +import TabItem from '@theme/TabItem'; + ## 开启状态管理 安装插件： @@ -13,13 +16,13 @@ $ npm i @ice/plugin-store -D 在 `ice.config.mts` 中添加插件： -```diff title="ice.config.mts" +```ts title="ice.config.mts" import { defineConfig } from '@ice/app'; -+ import store from '@ice/plugin-store'; +import store from '@ice/plugin-store'; export default defineConfig({ plugins: [ -+ store(), + store(), ], }); ``` @@ -41,12 +44,12 @@ interface User { } export default createModel({ - // 定义 model 的初始 state + // 定义 model 的初始 state state: { name: '', id: '', } as User, - // 定义改变该模型状态的纯函数 + // 定义改变该 model 状态的纯函数 reducers: { update(prevState, payload) { return { @@ -55,7 +58,7 @@ export default createModel({ }; }, }, - // 定义处理该模型副作用的函数 + // 定义处理该 model 副作用的函数 effects: (dispatch) => ({ async getUserInfo() { await delay(1000); @@ -70,7 +73,7 @@ export default createModel({ ### 初始化 Store -约定在 `src/store.ts` 中初始化 Store。 +约定在 `src/store.ts` 中初始化 Store： ```ts title="src/store.ts" import { createStore } from 'ice'; @@ -81,12 +84,377 @@ export default createStore({ user }); ### 在组件中使用 +```diff +import { useEffect } from 'react'; +import store from '@/store'; + +export default function Home() { ++ const [userState, userDispatchers] = store.useModel('user'); ++ useEffect(() => { ++ // 触发 dispatcher 获取数据并修改 state ++ userDispatchers.getUserInfo() ++ }, []) + return ( + <> ++ {userState.id} ++ {userState.name} + + ); +} +``` ## 页面状态 +注意：页面状态只能在该页面下的组件中使用，无法跨页面使用。 + ### 定义 Model +约定在当前路由目录下新建 models 目录并定义 model： + +```diff + src + └── pages + | ├── home // /home 页面 ++| │ ├── models // 定义 model ++| │ | └── title.ts + | │ └── index.tsx +``` + +定义 model 如下： +```ts title="src/pages/home/models/title.ts" +import { createModel } from 'ice'; + +export default createModel({ + state: { + title: '', + }, + reducers: { + update(prevState, payload) { + return { + ...prevState, + ...payload, + }; + }, + }, +}); +``` + ### 初始化 Store +约定在当前路由目录下新建 store 文件： + +```diff + src + └── pages + | ├── home // /home 页面 + | │ ├── models // 定义 model + | │ | └── info.ts ++| │ ├── store.ts // 创建 store + | │ └── index.tsx +``` + +```ts title="src/pages/home/store.ts" +import { createStore } from 'ice'; +import info from './models/info'; + +const store = createStore({ info }); + +export default store; +``` + ### 在组件中使用 + +```diff title="src/pages/home/index.tsx" +import { useEffect } from 'react'; +import homeStore from './store'; + +export default function Home() { ++ const [infoState, infoDispatchers] = homeStore.useModel('info'); + ++ useEffect(() => { ++ infoDispatchers.update({ title: 'ICE' }) ++ }, []) + return ( ++

{infoState.title}

+ ); +}; +``` + +## 进阶用法 + +### 设置初始状态 + +假设我们有 `models/user.ts` 和 `models/counter.ts` 两个 model，我们可以在 `src/app.ts` 中设置初始状态： + +```ts title="src/app.ts" +import { defineStoreConfig } from '@ice/plugin-store/esm/runtime'; + +export const store = defineStoreConfig(async () => { + // fetch Data + // const data = (await fetch('your-url')).json(); + return { + initialStates: { + user: { + name: 'ICE 3', + }, + counter: { + count: 1 + } + }, + }; +}); +``` + +> 注意：页面级状态目前不支持设置 initialStates + +### Model 定义详细说明 + +插件约定在 `src/models`、`src/pages/**/models` 目录下的文件为项目定义的 model 文件，每个文件需要默认导出一个对象。 + + +#### state + +定义 model 的初始 state： +```ts +import { createModel } from 'ice'; + +export default createModel({ + state: { count: 0 }, +}) +``` + +#### reducers + +```ts +reducers: { [string]: (prevState, payload) => any } +``` + +一个改变该模型状态的函数集合。这些方法以模型的上一次 prevState 和一个 payload 作为入参，在方法中使用可变的方式来更新状态。这些方法应该是仅依赖于 prevState 和 payload 参数来计算下一个 nextState 的纯函数。对于有副作用的函数，请使用 effects。 + +```ts +import { createModel } from 'ice'; + +export default ({ + state: { count: 0, list: [] }, + + reducers: { + increment (prevState, payload) { + const newList = prevState.list.slice(); + newList.push(payload); + const newCount = prevState.count + 1; + return { ...prevState, count: newCount, list: newList } + }, + decrement (prevState) { + return { ...prevState, count: prevState.count - 1 } + } + } +} +``` + +#### effects + +```ts +effects: (dispatch) => ({ [string]: (payload, rootState) => void }) +``` + +一个可以处理该模型副作用的函数集合。这些方法以 payload 和 rootState 作为入参，适用于进行异步调用、模型联动等场景。 + + +```ts +import { createModel } from 'ice'; + +export default createModel({ + reducers: { + increment() { + // ... + } + }, + effects: (dispatch) => ({ + async asyncDecrement() { + const list = (await fetch('your-url')).json(); // 进行一些异步操作 + this.increment(list); // 调用模型 reducers 内的方法来更新状态 + }, + }), +}) +``` + +### Model 之间通信 + +> 注意：如果两个 model 不属于同一个 store 实例，是无法通信的 + + + + +```ts +// src/models/user.ts +import { createModel } from 'ice'; + +export default createModel({ + state: { + name: '', + tasks: 0, + }, + effects: () => ({ + async refresh() { + const data = (await fetch('/user')).json(); + // 通过 this.foo 调用自身的 reducer + this.setState(data); + }, + }), +}); +``` + + + +```ts +// src/models/tasks.ts +export default { + state: [], + effects: (dispatch) => ({ + async refresh() { + const data = await fetch('/tasks'); + this.setState(data); + }, + async add(task) { + await fetch('/tasks/add', task); + // 调用另一个 model user 的 effects + await dispatch.user.refresh(); + // 通过 this.foo 调用自身的 effects + await this.refresh(); + }, + }), +}; +``` + + + + + +### Model 中使用 immer 更改 State + +Redux 默认的函数式写法在处理一些复杂对象的 state 时会非常繁琐。因此插件默认支持了使用 [immer](https://immerjs.github.io/immer/) 来操作 state： + +```diff +import { createModel } from 'ice'; + +export default createModel({ + state: { + tasks: ['A Task', 'B Task'], + detail: { + name: 'Bob', + age: 3, + }, + }, + reducers: { + addTasks(prevState, payload) { +- return { +- ..prevState, +- tasks: [ ...prevState.tasks, payload ], +- }, ++ prevState.tasks.push(payload); + }, + updateAge(prevState, payload) { +- return { +- ..prevState, +- detail: { +- ...prevState.detail, +- age: payload, +- }, +- }, ++ prevState.detail.age = payload; + } + } +}) +``` + +注意：因为 immer 无法支持字符串或数字这样的简单类型，因此如果 state 符合这种情况（极少数）则不支持通过 immer 操作，必须使用 Redux 默认的函数式写法（返回一个新值）： + +```diff +import { createModel } from 'ice'; + +export default createModel({ + state: 0, + reducers: { + add(prevState) { +- state += 1; ++ return state += 1; + }, + }, +}) +``` + +### 获取 effects 的 loading/error 状态 + +通过 `useModelEffectsState` API 即可获取到 `effects` 的 `loading` 和 `error` 状态。 + +```diff +import store from '@/store'; + +function FunctionComponent() { + const [state, dispatchers] = store.useModel('counter'); ++ const effectsState = store.useModelEffectsState('counter'); + + useEffect(() => { + dispatchers.asyncDecrement(); + }, []); + ++ console.log(effectsState.asyncDecrement.isLoading); // true ++ console.log(effectsState.asyncDecrement.error); // null +} +``` + +### 页面切换后重置状态 + +如果想切换页面后再次进入原页面重新初始化页面状态，需要添加以下配置： + +```diff title="ice.config.mts" +import { defineConfig } from '@ice/app'; +import store from '@ice/plugin-store'; + +export default defineConfig({ + plugins: [ +- store(), ++ store({ resetPageState: true }), + ], +}); +``` + +### 在 Class Component 中使用 + +通过 `withModel` 可以实现在 Class Component 中使用状态管理。 + +```tsx +import store from '@/store'; + +class TodoList extends React.Component { + render() { + const { todos } = this.props; + const [state, dispatchers] = todos; + console.log('state: ', state); + // ... + } +} + +export default store.withModel('todos')(TodoList); +// 绑定多个 model +// export default withModel('user')(withModel('todos')(TodoList)); +``` + +### Redux Devtools + +插件中默认集成了 Redux Devtools，不需要额外的配置就可以在 Redux Devtools 调试： + +![](https://img.alicdn.com/tfs/TB1wK4nqypE_u4jSZKbXXbCUVXa-1918-430.png) + +如果需要定义 Devtools 的参数，可以在 `createStore` 的 options 入参中配置： + +```ts +createStore({ user }, { + redux: { + devtoolOptions: { + // 更多配置参考：https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md + } + } +}) +``` From 424038a1d64f82949520fcb3da26ed4a75e94132 Mon Sep 17 00:00:00 2001 From: luhc228 Date: Mon, 5 Sep 2022 14:44:45 +0800 Subject: [PATCH 3/9] fix: diff syntax --- pnpm-lock.yaml | 130 +++++++++++++++++++++-------------- website/docusaurus.config.js | 7 +- website/package.json | 5 +- 3 files changed, 86 insertions(+), 56 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 60254c7d6..a0345a1d9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -826,6 +826,7 @@ importers: '@docusaurus/preset-classic': ^2.0.0 '@docusaurus/theme-common': ^2.0.0 '@docusaurus/theme-search-algolia': ^2.0.0 + '@docusaurus/types': ^2.1.0 '@easyops-cn/docusaurus-search-local': ^0.30.0 '@mdx-js/react': ^1.6.21 '@svgr/webpack': ^5.5.0 @@ -842,10 +843,10 @@ importers: url-loader: ^4.1.1 webpack: ^5.74.0 dependencies: - '@docusaurus/core': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu + '@docusaurus/core': 2.0.1_coe2saodzr6velnhige3ek3zsy '@docusaurus/preset-classic': 2.0.1_ehkv5rr5g2uhqebwwmza2da7ui - '@docusaurus/theme-search-algolia': 2.0.1_ehkv5rr5g2uhqebwwmza2da7ui - '@easyops-cn/docusaurus-search-local': 0.30.2_ik2xl2bh6ototnplekqpmssdza + '@docusaurus/theme-search-algolia': 2.0.1_obshufq6zogeqrxxwukrsuslyq + '@easyops-cn/docusaurus-search-local': 0.30.2_vgzo5jqxdnbc7pj3t5atmwshje '@mdx-js/react': 1.6.22_react@17.0.2 '@svgr/webpack': 5.5.0 clsx: 1.1.1 @@ -856,7 +857,8 @@ importers: url-loader: 4.1.1_u4acmn7fe6yqgbrqzialkgh5lu devDependencies: '@algolia/client-search': 4.13.1 - '@docusaurus/theme-common': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu + '@docusaurus/theme-common': 2.0.1_coe2saodzr6velnhige3ek3zsy + '@docusaurus/types': 2.1.0_sfoxds7t5ydpegc3knd667wn6m '@types/react': 17.0.48 '@types/react-dom': 17.0.17 glob: 7.2.0 @@ -4002,7 +4004,7 @@ packages: - '@algolia/client-search' dev: false - /@docusaurus/core/2.0.1_3tgeifm2vmwrlpqlopppsnjtcu: + /@docusaurus/core/2.0.1_aoyvzlomggvyirsrnkx2lqkjiy: resolution: {integrity: sha512-Prd46TtZdiixlTl8a+h9bI5HegkfREjSNkrX2rVEwJZeziSz4ya+l7QDnbnCB2XbxEG8cveFo/F9q5lixolDtQ==} engines: {node: '>=16.14'} hasBin: true @@ -4022,11 +4024,11 @@ packages: '@babel/traverse': 7.18.11 '@docusaurus/cssnano-preset': 2.0.1 '@docusaurus/logger': 2.0.1 - '@docusaurus/mdx-loader': 2.0.1_sfoxds7t5ydpegc3knd667wn6m + '@docusaurus/mdx-loader': 2.0.1_e7njuyukwke3dfkpruzdf3gfhy '@docusaurus/react-loadable': 5.5.2_react@17.0.2 - '@docusaurus/utils': 2.0.1 - '@docusaurus/utils-common': 2.0.1 - '@docusaurus/utils-validation': 2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.0.1 + '@docusaurus/utils-common': 2.0.1_@docusaurus+types@2.0.1 + '@docusaurus/utils-validation': 2.0.1_@docusaurus+types@2.0.1 '@slorber/static-site-generator-webpack-plugin': 4.0.7 '@svgr/webpack': 6.2.1 autoprefixer: 10.4.8_postcss@8.4.14 @@ -4098,9 +4100,8 @@ packages: - utf-8-validate - vue-template-compiler - webpack-cli - dev: false - /@docusaurus/core/2.0.1_aoyvzlomggvyirsrnkx2lqkjiy: + /@docusaurus/core/2.0.1_coe2saodzr6velnhige3ek3zsy: resolution: {integrity: sha512-Prd46TtZdiixlTl8a+h9bI5HegkfREjSNkrX2rVEwJZeziSz4ya+l7QDnbnCB2XbxEG8cveFo/F9q5lixolDtQ==} engines: {node: '>=16.14'} hasBin: true @@ -4120,11 +4121,11 @@ packages: '@babel/traverse': 7.18.11 '@docusaurus/cssnano-preset': 2.0.1 '@docusaurus/logger': 2.0.1 - '@docusaurus/mdx-loader': 2.0.1_e7njuyukwke3dfkpruzdf3gfhy + '@docusaurus/mdx-loader': 2.0.1_ny44vnc5t4rlukh2kzmv2f2kze '@docusaurus/react-loadable': 5.5.2_react@17.0.2 - '@docusaurus/utils': 2.0.1_@docusaurus+types@2.0.1 - '@docusaurus/utils-common': 2.0.1_@docusaurus+types@2.0.1 - '@docusaurus/utils-validation': 2.0.1_@docusaurus+types@2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.1.0 + '@docusaurus/utils-common': 2.0.1_@docusaurus+types@2.1.0 + '@docusaurus/utils-validation': 2.0.1_@docusaurus+types@2.1.0 '@slorber/static-site-generator-webpack-plugin': 4.0.7 '@svgr/webpack': 6.2.1 autoprefixer: 10.4.8_postcss@8.4.14 @@ -4196,6 +4197,7 @@ packages: - utf-8-validate - vue-template-compiler - webpack-cli + dev: false /@docusaurus/core/2.0.1_ejnjte2tbcf6ilyufjwb7hmbom: resolution: {integrity: sha512-Prd46TtZdiixlTl8a+h9bI5HegkfREjSNkrX2rVEwJZeziSz4ya+l7QDnbnCB2XbxEG8cveFo/F9q5lixolDtQ==} @@ -4345,7 +4347,7 @@ packages: - uglify-js - webpack-cli - /@docusaurus/mdx-loader/2.0.1_sfoxds7t5ydpegc3knd667wn6m: + /@docusaurus/mdx-loader/2.0.1_ny44vnc5t4rlukh2kzmv2f2kze: resolution: {integrity: sha512-tdNeljdilXCmhbaEND3SAgsqaw/oh7v9onT5yrIrL26OSk2AFwd+MIi4R8jt8vq33M0R4rz2wpknm0fQIkDdvQ==} engines: {node: '>=16.14'} peerDependencies: @@ -4355,7 +4357,7 @@ packages: '@babel/parser': 7.18.11 '@babel/traverse': 7.18.11 '@docusaurus/logger': 2.0.1 - '@docusaurus/utils': 2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.1.0 '@mdx-js/mdx': 1.6.22 escape-html: 1.0.3 file-loader: 6.2.0_webpack@5.74.0 @@ -4778,19 +4780,19 @@ packages: - webpack-cli dev: false - /@docusaurus/theme-common/2.0.1_3tgeifm2vmwrlpqlopppsnjtcu: + /@docusaurus/theme-common/2.0.1_aoyvzlomggvyirsrnkx2lqkjiy: resolution: {integrity: sha512-I3b6e/ryiTQMsbES40cP0DRGnfr0E2qghVq+XecyMKjBPejISoSFEDn0MsnbW8Q26k1Dh/0qDH8QKDqaZZgLhA==} engines: {node: '>=16.14'} peerDependencies: react: ^16.8.4 || ^17.0.0 react-dom: ^16.8.4 || ^17.0.0 dependencies: - '@docusaurus/mdx-loader': 2.0.1_sfoxds7t5ydpegc3knd667wn6m + '@docusaurus/mdx-loader': 2.0.1_e7njuyukwke3dfkpruzdf3gfhy '@docusaurus/module-type-aliases': 2.0.1_sfoxds7t5ydpegc3knd667wn6m '@docusaurus/plugin-content-blog': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu '@docusaurus/plugin-content-docs': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu '@docusaurus/plugin-content-pages': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu - '@docusaurus/utils': 2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.0.1 '@types/history': 4.7.11 '@types/react': 18.0.15 '@types/react-router-config': 5.0.6 @@ -4816,20 +4818,21 @@ packages: - utf-8-validate - vue-template-compiler - webpack-cli + dev: false - /@docusaurus/theme-common/2.0.1_aoyvzlomggvyirsrnkx2lqkjiy: + /@docusaurus/theme-common/2.0.1_coe2saodzr6velnhige3ek3zsy: resolution: {integrity: sha512-I3b6e/ryiTQMsbES40cP0DRGnfr0E2qghVq+XecyMKjBPejISoSFEDn0MsnbW8Q26k1Dh/0qDH8QKDqaZZgLhA==} engines: {node: '>=16.14'} peerDependencies: react: ^16.8.4 || ^17.0.0 react-dom: ^16.8.4 || ^17.0.0 dependencies: - '@docusaurus/mdx-loader': 2.0.1_e7njuyukwke3dfkpruzdf3gfhy + '@docusaurus/mdx-loader': 2.0.1_ny44vnc5t4rlukh2kzmv2f2kze '@docusaurus/module-type-aliases': 2.0.1_sfoxds7t5ydpegc3knd667wn6m '@docusaurus/plugin-content-blog': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu '@docusaurus/plugin-content-docs': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu '@docusaurus/plugin-content-pages': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu - '@docusaurus/utils': 2.0.1_@docusaurus+types@2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.1.0 '@types/history': 4.7.11 '@types/react': 18.0.15 '@types/react-router-config': 5.0.6 @@ -4855,9 +4858,8 @@ packages: - utf-8-validate - vue-template-compiler - webpack-cli - dev: false - /@docusaurus/theme-search-algolia/2.0.1_ehkv5rr5g2uhqebwwmza2da7ui: + /@docusaurus/theme-search-algolia/2.0.1_obshufq6zogeqrxxwukrsuslyq: resolution: {integrity: sha512-cw3NaOSKbYlsY6uNj4PgO+5mwyQ3aEWre5RlmvjStaz2cbD15Nr69VG8Rd/F6Q5VsCT8BvSdkPDdDG5d/ACexg==} engines: {node: '>=16.14'} peerDependencies: @@ -4865,13 +4867,13 @@ packages: react-dom: ^16.8.4 || ^17.0.0 dependencies: '@docsearch/react': 3.2.0_2mejme4rhc75e2dzcje7ywjyuq - '@docusaurus/core': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu + '@docusaurus/core': 2.0.1_coe2saodzr6velnhige3ek3zsy '@docusaurus/logger': 2.0.1 '@docusaurus/plugin-content-docs': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu - '@docusaurus/theme-common': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu + '@docusaurus/theme-common': 2.0.1_coe2saodzr6velnhige3ek3zsy '@docusaurus/theme-translations': 2.0.1 - '@docusaurus/utils': 2.0.1 - '@docusaurus/utils-validation': 2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.1.0 + '@docusaurus/utils-validation': 2.0.1_@docusaurus+types@2.1.0 algoliasearch: 4.13.1 algoliasearch-helper: 3.11.0_algoliasearch@4.13.1 clsx: 1.2.1 @@ -4975,7 +4977,29 @@ packages: - uglify-js - webpack-cli - /@docusaurus/utils-common/2.0.1: + /@docusaurus/types/2.1.0_sfoxds7t5ydpegc3knd667wn6m: + resolution: {integrity: sha512-BS1ebpJZnGG6esKqsjtEC9U9qSaPylPwlO7cQ1GaIE7J/kMZI3FITnNn0otXXu7c7ZTqhb6+8dOrG6fZn6fqzQ==} + peerDependencies: + react: ^16.8.4 || ^17.0.0 + react-dom: ^16.8.4 || ^17.0.0 + dependencies: + '@types/history': 4.7.11 + '@types/react': 18.0.17 + commander: 5.1.0 + joi: 17.6.0 + react: 17.0.2 + react-dom: 17.0.2_react@17.0.2 + react-helmet-async: 1.3.0_sfoxds7t5ydpegc3knd667wn6m + utility-types: 3.10.0 + webpack: 5.74.0 + webpack-merge: 5.8.0 + transitivePeerDependencies: + - '@swc/core' + - esbuild + - uglify-js + - webpack-cli + + /@docusaurus/utils-common/2.0.1_@docusaurus+types@2.0.1: resolution: {integrity: sha512-kajCCDCXRd1HFH5EUW31MPaQcsyNlGakpkDoTBtBvpa4EIPvWaSKy7TIqYKHrZjX4tnJ0YbEJvaXfjjgdq5xSg==} engines: {node: '>=16.14'} peerDependencies: @@ -4984,10 +5008,10 @@ packages: '@docusaurus/types': optional: true dependencies: + '@docusaurus/types': 2.0.1_sfoxds7t5ydpegc3knd667wn6m tslib: 2.4.0 - dev: false - /@docusaurus/utils-common/2.0.1_@docusaurus+types@2.0.1: + /@docusaurus/utils-common/2.0.1_@docusaurus+types@2.1.0: resolution: {integrity: sha512-kajCCDCXRd1HFH5EUW31MPaQcsyNlGakpkDoTBtBvpa4EIPvWaSKy7TIqYKHrZjX4tnJ0YbEJvaXfjjgdq5xSg==} engines: {node: '>=16.14'} peerDependencies: @@ -4996,15 +5020,16 @@ packages: '@docusaurus/types': optional: true dependencies: - '@docusaurus/types': 2.0.1_sfoxds7t5ydpegc3knd667wn6m + '@docusaurus/types': 2.1.0_sfoxds7t5ydpegc3knd667wn6m tslib: 2.4.0 + dev: false - /@docusaurus/utils-validation/2.0.1: + /@docusaurus/utils-validation/2.0.1_@docusaurus+types@2.0.1: resolution: {integrity: sha512-f14AnwFBy4/1A19zWthK+Ii80YDz+4qt8oPpK3julywXsheSxPBqgsND3LVBBvB2p3rJHvbo2m3HyB9Tco1JRw==} engines: {node: '>=16.14'} dependencies: '@docusaurus/logger': 2.0.1 - '@docusaurus/utils': 2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.0.1 joi: 17.6.0 js-yaml: 4.1.0 tslib: 2.4.0 @@ -5015,14 +5040,13 @@ packages: - supports-color - uglify-js - webpack-cli - dev: false - /@docusaurus/utils-validation/2.0.1_@docusaurus+types@2.0.1: + /@docusaurus/utils-validation/2.0.1_@docusaurus+types@2.1.0: resolution: {integrity: sha512-f14AnwFBy4/1A19zWthK+Ii80YDz+4qt8oPpK3julywXsheSxPBqgsND3LVBBvB2p3rJHvbo2m3HyB9Tco1JRw==} engines: {node: '>=16.14'} dependencies: '@docusaurus/logger': 2.0.1 - '@docusaurus/utils': 2.0.1_@docusaurus+types@2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.1.0 joi: 17.6.0 js-yaml: 4.1.0 tslib: 2.4.0 @@ -5033,8 +5057,9 @@ packages: - supports-color - uglify-js - webpack-cli + dev: false - /@docusaurus/utils/2.0.1: + /@docusaurus/utils/2.0.1_@docusaurus+types@2.0.1: resolution: {integrity: sha512-u2Vdl/eoVwMfUjDCkg7FjxoiwFs/XhVVtNxQEw8cvB+qaw6QWyT73m96VZzWtUb1fDOefHoZ+bZ0ObFeKk9lMQ==} engines: {node: '>=16.14'} peerDependencies: @@ -5044,6 +5069,7 @@ packages: optional: true dependencies: '@docusaurus/logger': 2.0.1 + '@docusaurus/types': 2.0.1_sfoxds7t5ydpegc3knd667wn6m '@svgr/webpack': 6.2.1 file-loader: 6.2.0_webpack@5.74.0 fs-extra: 10.1.0 @@ -5065,7 +5091,7 @@ packages: - uglify-js - webpack-cli - /@docusaurus/utils/2.0.1_@docusaurus+types@2.0.1: + /@docusaurus/utils/2.0.1_@docusaurus+types@2.1.0: resolution: {integrity: sha512-u2Vdl/eoVwMfUjDCkg7FjxoiwFs/XhVVtNxQEw8cvB+qaw6QWyT73m96VZzWtUb1fDOefHoZ+bZ0ObFeKk9lMQ==} engines: {node: '>=16.14'} peerDependencies: @@ -5075,7 +5101,7 @@ packages: optional: true dependencies: '@docusaurus/logger': 2.0.1 - '@docusaurus/types': 2.0.1_sfoxds7t5ydpegc3knd667wn6m + '@docusaurus/types': 2.1.0_sfoxds7t5ydpegc3knd667wn6m '@svgr/webpack': 6.2.1 file-loader: 6.2.0_webpack@5.74.0 fs-extra: 10.1.0 @@ -5104,7 +5130,7 @@ packages: immediate: 3.3.0 dev: false - /@easyops-cn/docusaurus-search-local/0.30.2_ik2xl2bh6ototnplekqpmssdza: + /@easyops-cn/docusaurus-search-local/0.30.2_vgzo5jqxdnbc7pj3t5atmwshje: resolution: {integrity: sha512-q2tYUuNjUbsSxv3vB04ItP/jp0teWswXtsLxNF6JgaDOHkNXEjQFmbaOoBLyIcPCawefxC0m/iZibzr1JAVGew==} engines: {node: '>=12'} peerDependencies: @@ -5113,11 +5139,11 @@ packages: react-dom: ^16.14.0 || ^17.0.0 || ^18.0.0 dependencies: '@docusaurus/plugin-content-docs': 2.0.1_dgha4rg2zabfmiwtfi4kc6fjjq - '@docusaurus/theme-common': 2.0.1_3tgeifm2vmwrlpqlopppsnjtcu + '@docusaurus/theme-common': 2.0.1_coe2saodzr6velnhige3ek3zsy '@docusaurus/theme-translations': 2.0.1 - '@docusaurus/utils': 2.0.1 - '@docusaurus/utils-common': 2.0.1 - '@docusaurus/utils-validation': 2.0.1 + '@docusaurus/utils': 2.0.1_@docusaurus+types@2.1.0 + '@docusaurus/utils-common': 2.0.1_@docusaurus+types@2.1.0 + '@docusaurus/utils-validation': 2.0.1_@docusaurus+types@2.1.0 '@easyops-cn/autocomplete.js': 0.38.1 '@node-rs/jieba': 1.6.1 cheerio: 1.0.0-rc.12 @@ -8583,7 +8609,7 @@ packages: postcss-modules-values: 4.0.0_postcss@8.4.12 postcss-value-parser: 4.2.0 semver: 7.3.7 - webpack: 5.74.0_@swc+core@1.2.210 + webpack: 5.74.0 /css-minimizer-webpack-plugin/3.4.1_webpack@5.74.0: resolution: {integrity: sha512-1u6D71zeIfgngN2XNRJefc/hY7Ybsxd74Jm4qngIXyUEk7fss3VUzuHxLAq/R8NAba4QU9OUSaMZlbpRc7bM4Q==} @@ -12744,7 +12770,7 @@ packages: webpack: ^5.0.0 dependencies: schema-utils: 4.0.0 - webpack: 5.74.0_@swc+core@1.2.210 + webpack: 5.74.0 /minimalistic-assert/1.0.1: resolution: {integrity: sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==} @@ -17397,6 +17423,7 @@ packages: serialize-javascript: 6.0.0 terser: 5.14.2 webpack: 5.74.0_esbuild@0.14.54 + dev: true /terser-webpack-plugin/5.3.5_vwzmvoh3samqo2nn3x7mqt365m: resolution: {integrity: sha512-AOEDLDxD2zylUGf/wxHxklEkOe2/r+seuyOWujejFrIxHf11brA1/dWQNIgXa1c6/Wkxgu7zvv0JhOWfc2ELEA==} @@ -17421,6 +17448,7 @@ packages: serialize-javascript: 6.0.0 terser: 5.14.2 webpack: 5.74.0_@swc+core@1.2.210 + dev: true /terser-webpack-plugin/5.3.5_webpack@5.74.0: resolution: {integrity: sha512-AOEDLDxD2zylUGf/wxHxklEkOe2/r+seuyOWujejFrIxHf11brA1/dWQNIgXa1c6/Wkxgu7zvv0JhOWfc2ELEA==} @@ -18342,7 +18370,7 @@ packages: mime-types: 2.1.35 range-parser: 1.2.1 schema-utils: 4.0.0 - webpack: 5.74.0_@swc+core@1.2.210 + webpack: 5.74.0 /webpack-dev-server/4.10.0_webpack@5.74.0: resolution: {integrity: sha512-7dezwAs+k6yXVFZ+MaL8VnE+APobiO3zvpp3rBHe/HmWQ+avwh0Q3d0xxacOiBybZZ3syTZw9HXzpa3YNbAZDQ==} @@ -18526,7 +18554,7 @@ packages: serve-index: 1.9.1 sockjs: 0.3.24 spdy: 4.0.2 - webpack: 5.74.0_esbuild@0.14.54 + webpack: 5.74.0 webpack-dev-middleware: 5.3.1_webpack@5.74.0 ws: 8.5.0 transitivePeerDependencies: @@ -18667,6 +18695,7 @@ packages: - '@swc/core' - esbuild - uglify-js + dev: true /webpack/5.74.0_esbuild@0.14.54: resolution: {integrity: sha512-A2InDwnhhGN4LYctJj6M1JEaGL7Luj6LOmyBHjcI8529cm5p6VXiTIW2sn6ffvEAKmveLzvu4jrihwXtPojlAA==} @@ -18706,6 +18735,7 @@ packages: - '@swc/core' - esbuild - uglify-js + dev: true /webpackbar/5.0.2_webpack@5.74.0: resolution: {integrity: sha512-BmFJo7veBDgQzfWXl/wwYXr/VFus0614qZ8i9znqcl9fnEdiVkdbi0TedLQ6xAK92HZHDJ0QmyQ0fmuZPAgCYQ==} diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 0210ceae7..e04f44d1f 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -1,7 +1,9 @@ -/** @type {import('@docusaurus/types').DocusaurusConfig} */ const navbar = require('./config/navbar'); const footer = require('./config/footer'); +/** + * @type {import('@docusaurus/types').DocusaurusConfig} + */ const config = { title: '飞冰 ICE ', tagline: ' 基于 React 的应用研发框架', @@ -20,9 +22,6 @@ const config = { }, navbar, footer, - prism: { - theme: require('prism-react-renderer/themes/oceanicNext'), - }, // algolia: { // apiKey: '01f284e7e1c13eac3dc14beb6d8b153d', // indexName: 'ice', diff --git a/website/package.json b/website/package.json index fdebca1eb..acabca055 100644 --- a/website/package.json +++ b/website/package.json @@ -23,13 +23,14 @@ "clsx": "^1.1.1", "file-loader": "^6.2.0", "prism-react-renderer": "^1.3.5", - "url-loader": "^4.1.1", "react": "^17.0.2", - "react-dom": "^17.0.2" + "react-dom": "^17.0.2", + "url-loader": "^4.1.1" }, "devDependencies": { "@algolia/client-search": "^4.9.1", "@docusaurus/theme-common": "^2.0.0", + "@docusaurus/types": "^2.1.0", "@types/react": "^17.0.39", "@types/react-dom": "^17.0.11", "glob": "^7.1.7", From 0fdb38501cc437a4f376a0a7a1a1119024b9c49d Mon Sep 17 00:00:00 2001 From: luhc228 Date: Mon, 5 Sep 2022 15:38:47 +0800 Subject: [PATCH 4/9] docs: add example link --- website/docs/guide/plugins/store.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/website/docs/guide/plugins/store.md b/website/docs/guide/plugins/store.md index 85379e05c..41da59dd2 100644 --- a/website/docs/guide/plugins/store.md +++ b/website/docs/guide/plugins/store.md @@ -6,6 +6,17 @@ order: 2 import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; +
+ 例子 + +
+ ## 开启状态管理 安装插件： From 761071715bf43e393105536679d2dc23896a5ef6 Mon Sep 17 00:00:00 2001 From: luhc228 Date: Mon, 5 Sep 2022 15:48:39 +0800 Subject: [PATCH 5/9] chore: summary name --- website/docs/guide/plugins/store.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/docs/guide/plugins/store.md b/website/docs/guide/plugins/store.md index 41da59dd2..e2836df0c 100644 --- a/website/docs/guide/plugins/store.md +++ b/website/docs/guide/plugins/store.md @@ -7,7 +7,7 @@ import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem';
- 例子 + 示例