neo-cmp-cli 1.2.20 → 1.2.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
  ## Neo 自定义组件开发工具
2
- neo-cmp-cli 是 Neo 自定义组件开发工具,基于 [AKFun](https://github.com/wibetter/akfun) 的工程能力,提供模板创建、编译构建、预览调试、多技术栈支持与一键发布。
2
+ neo-cmp-cli 是 Neo 自定义组件开发工具,基于 [AKFun](https://github.com/wibetter/akfun) 的工程能力,提供 初始化、编译构建、预览调试、热更新、多技术栈支持和一键发布等功能。
3
3
 
4
4
  ### 主要特性
5
5
  - **零配置**: 内置默认配置,开箱可用;
@@ -8,7 +8,7 @@ neo-cmp-cli 是 Neo 自定义组件开发工具,基于 [AKFun](https://github.
8
8
  - **灵活可配**: 支持 构建入口、别名、代理、SASS 注入、ESLint/StyleLint、Babel/Loader/Plugin 扩展等配置;
9
9
  - **样式与规范**: 内置 Autoprefixer、Sass、PostCSS、ESLint、StyleLint;
10
10
  - **参数替换**: 支持基于 [params-replace-loader](https://www.npmjs.com/package/params-replace-loader) 的环境变量批量替换;
11
- - **一键发布**: 内置发布到 OSS 的能力,支持自定义对象存储配置。
11
+ - **一键发布**: 内置发布到 OSS 的能力,并支持自定义对象存储配置。
12
12
 
13
13
  ### 模板类型(neo init 可选)
14
14
  - **React 模板**: [react-custom-cmp-template](https://github.com/wibetter/react-custom-cmp-template)
@@ -77,11 +77,11 @@ npm run publish2oss
77
77
  - **neo build2lib**: 产出 UMD/ESM 库文件(可配置)。
78
78
  - **neo publish2oss**: 构建并上传到对象存储(可自定义配置对象存储)。
79
79
 
80
- ## 内置自动识别自定义组件
81
- - **自动生成入口配置**: 当 `entry` 未配置时,会自动从 `src/components` 扫描并识别自定义组件,`src/components` 下的子目录名称作为自定义组件的 cmpType,并以其目录下的 `.ts/.tsx/.js/.jsx` 结尾的文件作为组件内容文件,model.[tj]s 作为模型内容文件;
82
- - **自动生成相关注册文件并注入**: 自动生成自定义组件注册文件和模型注册文件,并注入到构建脚本中,无需用户关注 [neo-register](https://www.npmjs.com/package/neo-register)。
80
+ ## 自动识别自定义组件
81
+ - **自动生成入口配置**: 当 `entry` 未配置时,自动从 `src/components` 目录下扫描并识别自定义组件,`src/components` 下的子目录名称作为自定义组件的 cmpType,并以其目录下的 `index.ts/.tsx/.js/.jsx` 文件作为组件内容文件,model.[tj]s 作为模型内容文件;
82
+ - **自动注册自定义组件**: 自动生成自定义组件注册文件和模型注册文件,并注入到构建脚本中,无需用户手动编写注册文件 [neo-register](https://www.npmjs.com/package/neo-register)。
83
83
 
84
- ## 发布到对象存储(OSS)
84
+ ## 支持本地构建并发布到对象存储(OSS)
85
85
  执行 `neo publish2oss` 即可构建并上传到对象存储。发布前请确保:
86
86
  - **package.json 的 name 唯一**
87
87
  - **version 不重复**
@@ -95,7 +95,7 @@ neo-cmp-cli 默认提供完整配置;如需自定义,使用 `neo config init
95
95
  以下为常用配置示例(片段可自由组合)。
96
96
 
97
97
  ### 1) 基础规范与检查
98
- ```bash
98
+ ```javascript
99
99
  module.exports = {
100
100
  settings: {
101
101
  enableESLint: true, // 是否开启ESLint,默认开启ESLint检测代码格式
@@ -107,7 +107,7 @@ module.exports = {
107
107
  ```
108
108
 
109
109
  ### 2) 构建入口(优先级:linkDebug/build2lib/publish2oss.entry > webpack.entry)
110
- ```bash
110
+ ```javascript
111
111
  module.exports = {
112
112
  webpack: {
113
113
  entry: { index: './src/index.js' },
@@ -117,11 +117,11 @@ module.exports = {
117
117
  publish2oss: { entry: {} },
118
118
  }
119
119
  ```
120
- 备注1: 当未配置 entry 时,cli 会自动根据 src/components 目录自动生成 entry 配置;
120
+ 备注1: 当未配置 entry 时,cli 会识别当前项目 src/components 目录下已有的自定义组件,并自动生成对应的 entry 构建入口配置;
121
121
  备注2: 详细配置方法请查看 Webpack 官网 ([关于entry的配置方法](https://www.webpackjs.com/configuration/entry-context/#entry))。
122
122
 
123
123
  ### 3) 解析配置(extensions/alias)
124
- ```bash
124
+ ```javascript
125
125
  module.exports = {
126
126
  webpack: {
127
127
  resolve: {
@@ -135,7 +135,7 @@ module.exports = {
135
135
  备注2: alias 的详细配置方法请查看 Webpack 官网 ([关于resolve-alias的配置方法](https://www.webpackjs.com/configuration/resolve/#resolve-alias))。
136
136
 
137
137
  ### 4) 页面模板与样式资源
138
- ```bash
138
+ ```javascript
139
139
  module.exports = {
140
140
  webpack: {
141
141
  template: '', // 自定义页面模板路径
@@ -145,7 +145,7 @@ module.exports = {
145
145
  ```
146
146
 
147
147
  ### 5) 依赖打包策略(忽略 node_modules)
148
- ```bash
148
+ ```javascript
149
149
  module.exports = {
150
150
  webpack: {
151
151
  ignoreNodeModules: true, // 打包时是否忽略 node_modules,默认为false
@@ -155,7 +155,7 @@ module.exports = {
155
155
  ```
156
156
 
157
157
  ### 6) TypeScript 声明文件与工程目录
158
- ```bash
158
+ ```javascript
159
159
  module.exports = {
160
160
  webpack: {
161
161
  createDeclaration: false, // 可选择是否生成ts声明文件,默认为false
@@ -165,7 +165,7 @@ module.exports = {
165
165
  ```
166
166
 
167
167
  ### 7) 环境变量替换(params-replace-loader)
168
- ```bash
168
+ ```javascript
169
169
  module.exports = {
170
170
  envParams: {
171
171
  common: { '#version#': '20250822.1' },
@@ -179,7 +179,7 @@ module.exports = {
179
179
  ```
180
180
 
181
181
  ### 8) 本地开发代理与 HTTPS
182
- ```bash
182
+ ```javascript
183
183
  module.exports = {
184
184
  preview: {
185
185
  proxyTable: {},
@@ -191,7 +191,7 @@ module.exports = {
191
191
  备注2: 启用 HTTPS 后,若浏览器提示不安全,可在 Chrome 地址栏打开 `chrome://flags/#allow-insecure-localhost` 并设置为 Enabled。
192
192
 
193
193
  ### 9) 库构建(UMD/ESM)
194
- ```bash
194
+ ```javascript
195
195
  module.exports = {
196
196
  build2lib: {
197
197
  NODE_ENV: 'production',
@@ -210,7 +210,7 @@ module.exports = {
210
210
  ```
211
211
 
212
212
  ### 10) 自定义 Loader / Plugin / Babel Plugins
213
- ```bash
213
+ ```javascript
214
214
  module.exports = {
215
215
  webpack: {
216
216
  moduleRules: [], // 用于添加自定义 loaders
@@ -227,7 +227,7 @@ module.exports = {
227
227
  备注: 以上自定义 babelPlugins 用于实现 [element-ui 组件按需引入](https://element.eleme.cn/#/zh-CN/component/quickstart#an-xu-yin-ru)。
228
228
 
229
229
  也支持以函数形式动态调整内置 Babel Plugins:
230
- ```bash
230
+ ```javascript
231
231
  module.exports = {
232
232
  webpack: {
233
233
  babelPlugins: (curBabelPlugins) => {
@@ -238,5 +238,33 @@ module.exports = {
238
238
  }
239
239
  ```
240
240
 
241
+ ### 11) 自定义组件之间实现模块共享
242
+
243
+ 步骤1:在自定义组件A(cmpType:neo-custom-cmpA)/ 配置文件中定义要共享出来的模块A(xxModule_A)
244
+ ```javascript
245
+ module.exports = {
246
+ neoCommonModule: {
247
+ // neoExports: ['xxModule'], // 数组写法,可用于导出第三方依赖模块
248
+ neoExports: { 'xxModule_A': path.resolve('./src/components/xxModule_A') }, // 对象写法,如果导出内容模块,需要使用绝对路径导出
249
+ },
250
+ }
251
+ ```
252
+
253
+ 步骤2:在自定义组件B(cmpType:neo-custom-cmpB)/ 配置文件中 声明需要使用 自定义组件 A 分享出来的模块(xxModule_A)
254
+ ```javascript
255
+ module.exports = {
256
+ neoCommonModule: {
257
+ remotes: ['neo-custom-cmpA'], // 远程自定义组件,表示当前自定义组件 B 会用到的自定义组件
258
+ neoExternals: ['xxModule_A'], // 自定义组件中需要剔除的模块(远程自定义组件中分享出来的模块),仅支持数组写法,需要和 remotes 配合使用
259
+ },
260
+ }
261
+ ```
262
+
263
+ 步骤3:在自定义组件B 源码中使用 自定义组件 A 分享出来的模块(xxModule_A)
264
+ ```javascript
265
+ import ChartWidget from 'chart-widget'; // 导入自定义组件 A 导出的模块
266
+ ```
267
+
268
+
241
269
  ---
242
270
  如需更多细节与高级用法,请参考模板项目与源码注释。
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "neo-cmp-cli",
3
- "version": "1.2.20",
3
+ "version": "1.2.22",
4
4
  "description": "前端脚手架:自定义组件开发工具,支持react 和 vue2.0技术栈。",
5
5
  "keywords": [
6
6
  "neo-cli",
@@ -41,10 +41,10 @@ module.exports = {
41
41
  // 用于添加 Neo 共享依赖模块和剔除模块
42
42
  /*
43
43
  neoCommonModule: {
44
+ remotes: ['chart-widget'], // 远程自定义组件,表示当前自定义组件会用到的远程组件
45
+ neoExternals: ['chart-widget'], // 自定义组件中需要剔除的模块,仅支持数组写法,需要和 remotes 配合使用
44
46
  // neoExports: ['xxModule'], // 自定义组件 共享出来的模块,支持数组和对象形式
45
47
  // neoExports: { 'xxModule': path.resolve('./src/components/xxModule') }, // 对象写法
46
- neoExternals: ['chart-widget'], // 自定义组件中需要剔除的模块,仅支持数组写法
47
- remotes: ['chart-widget'], // 远程组件,表示当前自定义组件会用到的远程组件,需要和 neoExternals 配合使用
48
48
  },
49
49
  */
50
50
  preview: {
@@ -47,7 +47,7 @@
47
47
  "@commitlint/config-conventional": "^9.1.1",
48
48
  "@types/react": "^16.9.11",
49
49
  "@types/react-dom": "^16.9.15",
50
- "neo-cmp-cli": "^1.2.19",
50
+ "neo-cmp-cli": "^1.2.22",
51
51
  "husky": "^4.2.5",
52
52
  "lint-staged": "^10.2.9",
53
53
  "prettier": "^2.0.5"
@@ -51,7 +51,7 @@
51
51
  "@types/react": "^16.9.11",
52
52
  "@types/react-dom": "^16.9.15",
53
53
  "@types/axios": "^0.14.0",
54
- "neo-cmp-cli": "^1.2.19",
54
+ "neo-cmp-cli": "^1.2.22",
55
55
  "husky": "^4.2.5",
56
56
  "lint-staged": "^10.2.9",
57
57
  "prettier": "^2.0.5"
@@ -46,8 +46,8 @@ module.exports = {
46
46
  'chart-widget': path.resolve('./src/components/chart-widget'), // 导出图表自定义组件
47
47
  'neo-register': 'neo-register', // 导出 Neo 注册模块
48
48
  },
49
- // neoExternals: ['xxModule'], // 自定义组件中需要剔除的模块,仅支持数组写法
50
- // remotes: ['xxModule'], // 远程组件,表示当前自定义组件会用到的远程组件,需要和 neoExternals 配合使用
49
+ // remotes: ['xxModule'], // 远程组件,表示当前自定义组件会用到的远程组件
50
+ // neoExternals: ['xxModule'], // 自定义组件中需要剔除的模块,仅支持数组写法,需要和 remotes 配合使用
51
51
  },
52
52
  //*/
53
53
  preview: {
@@ -47,7 +47,7 @@
47
47
  "@commitlint/config-conventional": "^9.1.1",
48
48
  "@types/react": "^16.9.11",
49
49
  "@types/react-dom": "^16.9.15",
50
- "neo-cmp-cli": "^1.2.19",
50
+ "neo-cmp-cli": "^1.2.22",
51
51
  "husky": "^4.2.5",
52
52
  "lint-staged": "^10.2.9",
53
53
  "prettier": "^2.0.5",
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "neo-custom-cmp-template",
3
- "version": "1.1.6.beta1",
3
+ "version": "1.1.7",
4
4
  "description": "neo自定义组件模板(react&ts技术栈)",
5
5
  "keywords": [
6
6
  "自定义组件模板",
@@ -52,7 +52,7 @@
52
52
  "@types/react": "^16.9.11",
53
53
  "@types/react-dom": "^16.9.15",
54
54
  "@types/axios": "^0.14.0",
55
- "neo-cmp-cli": "^1.2.19",
55
+ "neo-cmp-cli": "^1.2.22",
56
56
  "husky": "^4.2.5",
57
57
  "lint-staged": "^10.2.9",
58
58
  "prettier": "^2.0.5"
@@ -44,7 +44,7 @@
44
44
  "devDependencies": {
45
45
  "@commitlint/cli": "^8.3.5",
46
46
  "@commitlint/config-conventional": "^9.1.1",
47
- "neo-cmp-cli": "^1.2.19",
47
+ "neo-cmp-cli": "^1.2.22",
48
48
  "husky": "^4.2.5",
49
49
  "lint-staged": "^10.2.9",
50
50
  "prettier": "^2.0.5"
@@ -46,7 +46,7 @@
46
46
  "@commitlint/config-conventional": "^9.1.1",
47
47
  "@types/react": "^16.9.11",
48
48
  "@types/react-dom": "^16.9.15",
49
- "neo-cmp-cli": "^1.2.19",
49
+ "neo-cmp-cli": "^1.2.22",
50
50
  "husky": "^4.2.5",
51
51
  "lint-staged": "^10.2.9",
52
52
  "prettier": "^2.0.5"
@@ -44,7 +44,7 @@
44
44
  "devDependencies": {
45
45
  "@commitlint/cli": "^8.3.5",
46
46
  "@commitlint/config-conventional": "^9.1.1",
47
- "neo-cmp-cli": "^1.2.19",
47
+ "neo-cmp-cli": "^1.2.22",
48
48
  "husky": "^4.2.5",
49
49
  "lint-staged": "^10.2.9",
50
50
  "prettier": "^2.0.5",