docs: 补充快速上手和主题中的配置项的解释 #3163
docs: 补充快速上手和主题中的配置项的解释 #3163
Conversation
github-actions
bot
added
action:review
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## feat_v3.x #3163 +/- ##
==========================================
Coverage 87.19% 87.20%
==========================================
Files 279 279
Lines 18540 18540
Branches 2821 2822 +1
==========================================
+ Hits 16166 16167 +1
+ Misses 2369 2368 -1
Partials 5 5 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Walkthrough本次变更主要更新了 NutUI-React 与 NutUI-React-Taro 文档中关于按需导入 CSS 与 SCSS 文件的说明。文档中在 vite/plugin 和 babel 配置部分增加了额外注释，明确说明了如何处理 CSS 与 SCSS 的导入方式，同时对 SCSS 文件的返回路径和某些拼写错误进行了修正。此次调整仅限于文档说明的补充，不涉及任何功能性更改。 Changes
Possibly related PRs
Suggested reviewers
Poem
Tip ⚡💬 Agentic Chat (Pro Plan, General Availability)
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
⏰ Context from checks skipped due to timeout of 90000ms (1)
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (6)
src/sites/sites-react/doc/docs/taro/theme-react.md (1)
23-24: 建议优化文档格式
当前新增的说明内容使用了加粗文本的格式。如果其目的是作为提示或说明标题，建议使用标题语法（例如 “#### 提示”）或引用块，以提高 Markdown 格式的一致性，并避免触发 markdownlint 的 MD036 警告。下面是一份建议的 diff 改动：
-**使用 SCSS 文件自定义主题时，需将按需引入设置为 scss 文件的方式，参考快速入手中的自动按需加载配置项中的描述** +**使用 SCSS 文件自定义主题时，请将按需引入配置设置为 SCSS 文件的方式。详细说明请参见快速上手章节中自动按需加载配置项的描述。**🧰 Tools
🪛 markdownlint-cli2 (0.17.2)
23-23: Emphasis used instead of a heading
null(MD036, no-emphasis-as-heading)
src/sites/sites-react/doc/docs/react/theme-react.en-US.md (2)
26-26: 建议调整英文描述以提高表达准确性
当前文本“set the on-demand import to the SCSS file method”语句略显冗长且介词使用不够准确，建议调整为更简洁清晰的表达。建议改为如下文本：
-**When customizing themes using SCSS files, you need to set the on-demand import to the SCSS file method. Refer to the description in the automatic on-demand loading configuration in the quick start guide.** +**When customizing themes using SCSS files, you need to configure the on-demand import method to use SCSS files. Refer to the automatic on-demand loading configuration described in the quick start guide.**🧰 Tools
🪛 LanguageTool
[uncategorized] ~26-~26: The preposition “of” seems more likely in this position.
Context: ...S file method. Refer to the description in the automatic on-demand loading configu...(AI_EN_LECTOR_REPLACEMENT_PREPOSITION)
37-37: 建议修正标记符格式
此处 "** sass-loader**" 内存在多余的空格。建议去除空格，确保强调文本格式正确。建议改为如下：
-Modify the ** sass-loader** configuration in the 'vite' or 'webpack' configuration file. The following example +Modify the **sass-loader** configuration in the 'vite' or 'webpack' configuration file. The following example:src/sites/sites-react/doc/docs/react/theme-react.md (1)
23-24: 建议优化文档用词
建议修改此处说明的语句，使表达更为准确和统一。建议调整如下：
-**使用 SCSS 文件自定义主题时，需将按需引入设置为 scss 文件的方式，参考快速入手中的自动按需加载配置项中的描述** +**使用 SCSS 文件自定义主题时，请将按需引入配置设置为 SCSS 文件的方式。详细说明请参见快速上手章节中自动按需加载配置项的描述。**src/sites/sites-react/doc/docs/taro/theme-react.en-US.md (2)
26-26: 建议调整英文描述以提高表达清晰度
建议对该处英文提示进行小幅调整，使语句更加流畅、准确。建议修改如下：
-**When customizing themes using SCSS files, you need to set the on-demand import to the SCSS file method. Refer to the description in the automatic on-demand loading configuration in the quick start guide.** +**When customizing themes using SCSS files, you need to configure the on-demand import method to use SCSS files. Refer to the automatic on-demand loading configuration described in the quick start guide.**🧰 Tools
🪛 LanguageTool
[uncategorized] ~26-~26: The preposition “of” seems more likely in this position.
Context: ...S file method. Refer to the description in the automatic on-demand loading configu...(AI_EN_LECTOR_REPLACEMENT_PREPOSITION)
37-37: 建议修正标记中多余的空格
“** sass-loader**” 中的多余空格建议去除，确保格式整洁。建议调整如下：
-Modify the ** sass-loader** configuration in the 'vite' or 'webpack' configuration file. The following example +Modify the **sass-loader** configuration in the 'vite' or 'webpack' configuration file. The following example:🧰 Tools
🪛 markdownlint-cli2 (0.17.2)
37-37: Spaces inside emphasis markers
null(MD037, no-space-in-emphasis)
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (8)
src/sites/sites-react/doc/docs/react/start-react.en-US.md(2 hunks)src/sites/sites-react/doc/docs/react/start-react.md(2 hunks)src/sites/sites-react/doc/docs/react/theme-react.en-US.md(1 hunks)src/sites/sites-react/doc/docs/react/theme-react.md(1 hunks)src/sites/sites-react/doc/docs/taro/start-react.en-US.md(1 hunks)src/sites/sites-react/doc/docs/taro/start-react.md(1 hunks)src/sites/sites-react/doc/docs/taro/theme-react.en-US.md(2 hunks)src/sites/sites-react/doc/docs/taro/theme-react.md(1 hunks)
🧰 Additional context used
🪛 LanguageTool
src/sites/sites-react/doc/docs/react/theme-react.en-US.md
[uncategorized] ~26-~26: The preposition “of” seems more likely in this position.
Context: ...S file method. Refer to the description in the automatic on-demand loading configu...
(AI_EN_LECTOR_REPLACEMENT_PREPOSITION)
src/sites/sites-react/doc/docs/taro/theme-react.en-US.md
[uncategorized] ~26-~26: The preposition “of” seems more likely in this position.
Context: ...S file method. Refer to the description in the automatic on-demand loading configu...
(AI_EN_LECTOR_REPLACEMENT_PREPOSITION)
🪛 markdownlint-cli2 (0.17.2)
src/sites/sites-react/doc/docs/taro/theme-react.en-US.md
37-37: Spaces inside emphasis markers
null
(MD037, no-space-in-emphasis)
src/sites/sites-react/doc/docs/taro/theme-react.md
23-23: Emphasis used instead of a heading
null
(MD036, no-emphasis-as-heading)
🔇 Additional comments (3)
src/sites/sites-react/doc/docs/taro/start-react.md (1)
1-221: 无明显修改，文档内容整体清晰
当前文档内容逻辑清晰且描述详细，未检测到针对本次 PR 的新增或修改内容。src/sites/sites-react/doc/docs/taro/start-react.en-US.md (1)
143-143: 文档注释更新得当
在 Babel 配置中，对style属性的注释增强了说明，明确指出如果需要导入 SCSS 文件，可以将style设置为 true，从而帮助用户更好地理解可选的样式导入方式。src/sites/sites-react/doc/docs/react/start-react.en-US.md (1)
138-138: Babel 配置注释更新良好
在 Babel 插件的配置中，对style属性的注释进行了改进，清晰地说明了默认按需导入 CSS 文件以及如何通过设置为 true 来导入 SCSS 文件，非常直观。
| style: (name) => { | ||
| // 按需引入 css 文件的处理，两种方式择其一 | ||
| return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style/css` | ||
| // 按需引入 scss 文件的处理，两种方式择其一 | ||
| return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style` |
There was a problem hiding this comment.
🛠️ Refactor suggestion
建议优化返回语句逻辑
在 vite-plugin-imp 的配置示例中，style 函数内存在连续两个 return 语句，其中第一个 return 会使第二个返回永远无法执行。这可能会给用户造成困惑。建议将其中一个返回语句注释掉，并提供详细说明，让用户根据需要选择对应的导入方式。例如，可以保留“按需引入 CSS 文件”的 return，而将“按需引入 SCSS 文件”的返回语句注释掉，并在注释中说明如何切换。
- style: (name) => {
- // 按需引入 css 文件的处理，两种方式择其一
- return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style/css`
- // 按需引入 scss 文件的处理，两种方式择其一
- return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style`
- },
+ style: (name) => {
+ // 根据需要选择导入方式，注释掉不使用的方案：
+ // 方案一：按需引入 CSS 文件
+ // return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style/css`;
+ // 方案二：按需引入 SCSS 文件
+ return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style`;
+ },📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| style: (name) => { | |
| // 按需引入 css 文件的处理，两种方式择其一 | |
| return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style/css` | |
| // 按需引入 scss 文件的处理，两种方式择其一 | |
| return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style` | |
| style: (name) => { | |
| // 根据需要选择导入方式，注释掉不使用的方案： | |
| // 方案一：按需引入 CSS 文件 | |
| // return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style/css`; | |
| // 方案二：按需引入 SCSS 文件 | |
| return `@nutui/nutui-react/dist/es/packages/${name.toLowerCase()}/style`; | |
| }, |
3 participants
Summary by CodeRabbit