@modern-js/main-doc 2.2.0 → 2.4.0

package/zh/guides/topic-detail/monorepo/sub-project-interface.mdx

@@ -109,7 +109,7 @@ export default App;
 
 到此为止我们创建了一个可以被发布到外部的组件项目、一个转换字符串的内部模块项目以及一个使用组件和内部模块的应用项目，如果直接运行应用项目还暂时无法正常使用。接下来将要介绍如何让它们能够互相联调使用，成功的使应用子项目 `apps/app` 正常运行。
 
-:::info 注
+:::info
 启动 `apps/app` 项目之前需要先构建（`pnpm run build`） `packages/component`。
 
 :::
@@ -130,7 +130,7 @@ pnpm add components
 pnpm add internal-lib -D
 ```
 
-:::info 注
+:::info
 注意这里将 internal-lib 作为 `apps/app` 项目的开发依赖，因为在构建环境会被打包到构建产物中。
 
 :::

package/zh/tutorials/first-app/c02-component.mdx

@@ -48,7 +48,7 @@ function App() {
 
 可以看到 Ant Design 导出的组件，已经具备了完整的样式。
 
-:::info 注
+:::info
 Modern.js 会[自动按需导入 Ant Design 组件需要的 CSS](https://github.com/ant-design/babel-plugin-import)。
 
 :::

package/zh/tutorials/first-app/c03-css.mdx

@@ -94,7 +94,7 @@ export default Avatar;
 
 执行 `pnpm run dev`，运行结果应该是一样的。
 
-:::info 注
+:::info
 采用目录形式 `Avatar/index.tsx` 而不是单文件形式 `Avatar.tsx` 的原因是，之后可以方便的在目录内部增加子文件，包括专用的资源（图片等）、专用子组件、CSS 文件等。
 
 :::
@@ -293,7 +293,7 @@ import '../styles/utils.css';
 }
 ```
 
-:::info 注
+:::info
 Modern.js 集成了 [PostCSS](/guides/basic-features/css/postcss)，支持现代 CSS 语法特性，比如 [custom properties](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties)。
 
 :::
@@ -314,7 +314,7 @@ Modern.js 集成了 [PostCSS](/guides/basic-features/css/postcss)，支持现代
 
 ![design2](https://lf3-static.bytednsdoc.com/obj/eden-cn/aphqeh7uhohpquloj/modern-js/docs/06/result3.png)
 
-:::info 注
+:::info
 此处只是为了演示 Utility Class 用法。真实项目中，在有 Tailwind CSS 的情况下，这种 Utility Class 没什么价值，应该通过配置 Design System 的 [**theme**](https://tailwindcss.com/docs/customizing-colors) 来增加字体颜色。
 
 `utils.css` 也可以写成 `utils.scss` 或 `utils.less`，Modern.js 对 SCSS 和 Less 同样提供开箱即用的支持。

package/zh/tutorials/first-app/c04-routes.mdx

@@ -84,7 +84,7 @@ function Index() {
 }
 ```
 
-:::info 注
+:::info
 Modern.js 默认集成了 react-helmet，也可以结合 SSR 使用，满足 SEO 需求。
 
 :::

package/zh/tutorials/first-app/c06-model.mdx

@@ -10,7 +10,7 @@ title: 添加业务模型（状态管理）
 
 因此会开始编写一些跟 UI 完全无关的业务逻辑，如果继续写在组件代码中，会产生越来越多的面条式代码。为此，我们引入了一种叫做 **业务模型（Model）** 的代码模块，将这些业务逻辑和 UI 解耦。
 
-:::info 注意
+:::info意
 使用状态管理相关 API，需要先启用配置项 [runtime.state](/docs/configure/app/runtime/state)：
 
 ```ts title="modern.config.ts"