Skip to content

feat: add plugin for bizui using nutui #3318

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 1, 2025
Merged

feat: add plugin for bizui using nutui #3318

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions packages/nutui-inject-ui-styles/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.idea/
.vscode/
node_modules/
37 changes: 37 additions & 0 deletions packages/nutui-inject-ui-styles/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
# @nutui/inject-ui-styles

## 功能说明

用于支持不同组件库引入 nutui 的样式文件，尤其是对于鸿蒙和 React Native 平台。

## 使用方法

1. 在 babel.config.js 文件中增加如下代码

```js
const injectUIStyles = require('@nutui/inject-ui-styles')

{
[
[injectUIStyles({})]
]
}
```
Comment on lines +11 to +19
Copy link

@coderabbitai coderabbitai bot Aug 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

文档中的使用示例与实际导出不匹配

文档中的使用示例存在严重问题：示例中使用的是 injectUIStyles，但根据 src/index.ts 文件，包实际导出的是 babelComponentStyle。这会导致用户按照文档使用时出现运行时错误。

需要修正使用示例：

-const injectUIStyles = require('@nutui/inject-ui-styles')
+const babelComponentStyle = require('@nutui/inject-ui-styles')

 {
   [
-    [injectUIStyles({})]
+    [babelComponentStyle]
   ]
 }
📝 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.

Suggested change
```js
const injectUIStyles = require('@nutui/inject-ui-styles')
{
[
[injectUIStyles({})]
]
}
```
const babelComponentStyle = require('@nutui/inject-ui-styles')
{
[
[babelComponentStyle]
]
}
🤖 Prompt for AI Agents 
In packages/nutui-inject-ui-styles/README.md around lines 11 to 19, the usage
example incorrectly references injectUIStyles, but the actual export from
src/index.ts is babelComponentStyle. Update the example code to use
babelComponentStyle instead of injectUIStyles to match the real export and
prevent runtime errors for users following the documentation.


2. 在 config/index.js 文件中增加如下内容( 废弃 )

```js
const {viteComponentStyle} = require('@nutui/inject-ui-styles')

{
harmony: {
// 将编译方式设置为使用 Vite 编译
compiler: {
type: 'vite',
vitePlugins: [
viteComponentStyle({cName: '@nutui/nutui-react-taro', pName:'@xxx/ui'})
]
}
}
}
```
189 changes: 189 additions & 0 deletions packages/nutui-inject-ui-styles/dist/index.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/nutui-inject-ui-styles/dist/index.js.map
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

44 changes: 44 additions & 0 deletions packages/nutui-inject-ui-styles/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
{
"name": "@nutui/inject-ui-styles",
"version": "0.0.1",
"description": "",
Copy link

@coderabbitai coderabbitai bot Aug 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

请填写缺失的包元数据字段

包的 description、author、homepage 字段为空，repository 和 bugs 的 URL 也未填写。这些信息对于包的文档和维护很重要，建议补充完整。

-    "description": "",
+    "description": "Babel plugin for injecting NutUI component styles automatically",
     "keywords": [
         "Taro",
         "Plugin"
     ],
-    "author": "",
-    "homepage": "",
+    "author": "NutUI Team",
+    "homepage": "https://github.com/jdf2e/nutui-react/tree/main/packages/nutui-inject-ui-styles",
     "license": "MIT",
     "main": "dist/index.js",
     "typings": "types/index.d.ts",
     "files": [
         "dist",
         "index.js",
         "types"
     ],
     "repository": {
         "type": "git",
-        "url": ""
+        "url": "https://github.com/jdf2e/nutui-react.git"
     },
     "scripts": {
         "build": "rollup -c",
         "dev": "rollup -c -w"
     },
     "bugs": {
-        "url": ""
+        "url": "https://github.com/jdf2e/nutui-react/issues"
     },

Also applies to: 9-10, 21-22, 28-29

🤖 Prompt for AI Agents 
In packages/nutui-inject-ui-styles/package.json at lines 4, 9-10, 21-22, and
28-29, the package metadata fields such as description, author, homepage,
repository URL, and bugs URL are missing or empty. Fill in these fields with
accurate and complete information relevant to the package to improve
documentation and maintenance. Ensure the description briefly explains the
package purpose, author includes contact or name, homepage points to the project
site, and repository and bugs URLs link to the correct source and issue tracker
locations.

"keywords": [
"Taro",
"Plugin"
],
"author": "",
"homepage": "",
"license": "MIT",
"main": "dist/index.js",
"typings": "types/index.d.ts",
"files": [
"dist",
"index.js",
"types"
],
Comment on lines +14 to +18
Copy link

@coderabbitai coderabbitai bot Aug 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Verification agent

🧩 Analysis chain

验证 files 数组中的路径配置

files 数组同时包含了 "dist" 和 "index.js"。如果 index.js 实际上位于 dist 目录下（作为 main 入口），这个配置可能是冗余的。请确认 index.js 文件的实际位置。

🏁 Script executed:

#!/bin/bash
# 检查 index.js 文件的位置
fd -t f "^index\.js$" packages/nutui-inject-ui-styles --max-depth 2

Length of output: 115

删除冗余的 files 配置

packages/nutui-inject-ui-styles/package.json 中的 files 数组包含了 "index.js"，但实际上该项目根目录下并不存在 index.js，只有 dist/index.js 会被打包。请将 "index.js" 从 files 中移除，以避免发布时出现遗漏或误导。

需要修改的文件：

  • packages/nutui-inject-ui-styles/package.json

建议改动：

-  "files": [
-    "dist",
-    "index.js",
-    "types"
-  ],
+  "files": [
+    "dist",
+    "types"
+  ],
🤖 Prompt for AI Agents 
In packages/nutui-inject-ui-styles/package.json around lines 14 to 18, the
"files" array includes "index.js" which does not exist in the project root and
may cause confusion or packaging errors. Remove the "index.js" entry from the
"files" array so that only existing paths like "dist" and "types" are included
for packaging.

"repository": {
"type": "git",
"url": ""
},
"scripts": {
"build": "rollup -c",
"dev": "rollup -c -w"
},
"bugs": {
"url": ""
},
"dependencies": {
"@tarojs/service": "^4.0.0",
"lodash.kebabcase": "^4.1.1",
"tslib": "^2.6.2",
"webpack-chain": "^6.5.1"
},
"devDependencies": {
"@types/lodash.kebabcase": "^4.1.9",
"@types/node": "^18.13.0",
"prettier": "^3.2.5",
"rollup": "^2.79.0",
"rollup-plugin-ts": "^3.0.2",
"typescript": "^5.4.5"
}
}
22 changes: 22 additions & 0 deletions packages/nutui-inject-ui-styles/rollup.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
const path = require('path')
const ts = require('rollup-plugin-ts')

const cwd = __dirname

const base = {
external: ['@tarojs/service'],
plugins: [ts()],
}

// 供 CLI 编译时使用的 Taro 插件入口
const compileConfig = {
input: path.join(cwd, 'src/index.ts'),
output: {
file: path.join(cwd, 'dist/index.js'),
format: 'cjs',
sourcemap: true,
},
...base,
}

module.exports = [compileConfig]
Loading
Loading