@@ -12,6 +12,8 @@ order: 0902
12
12
13
13
### 依赖修改
14
14
15
+ #### 框架依赖
16
+
15
17
``` diff
16
18
{
17
19
"devDependencies": {
@@ -22,40 +24,146 @@ order: 0902
22
24
}
23
25
```
24
26
25
- 对应插件能力:
26
- - @ali/build-plugin-ice-def -> @ali/ice-plugin-def
27
- - build-plugin-moment-locales -> @ice/plugin-moment-locales
28
- - build-plugin-fusion -> @ice/plugin-fusion (多主题能力暂不支持)
29
- - build-plugin-antd -> @ice/plugin-antd
30
- - build-plugin-css-assets-local -> @ice/plugin-css-assets-local
31
- - build-plugin-jsx-plus -> @ice/plugin-jsx-plus [ 文档] ( ../advanced/jsx-plus.md )
32
- - build-plugin-keep-alive 不再支持,有 ice.js 3.0 的 [ keep alive 方案] ( ../advanced/keep-alive.md ) 替代
27
+ #### 插件依赖
28
+ ##### @ali/build-plugin-ice-def
29
+ 插件替换为 ` @ali/ice-plugin-def ` ,使用版本 1.2.4+,使用方式:
30
+
31
+ ``` ts title="ice.config.mts"
32
+ import { defineConfig } from ' @ice/app' ;
33
+ import def from ' @ali/ice-plugin-def' ;
34
+
35
+ export default defineConfig (() => ({
36
+ plugins: [
37
+ def (),
38
+ ],
39
+ }));
40
+ ```
33
41
34
- 插件使用方式变更为函数调用:
42
+ ##### build-plugin-moment-locales
43
+
44
+ 插件替换为 ` @ice/plugin-moment-locales ` ,使用版本 1.0.2+,使用方式:
35
45
36
46
``` ts title="ice.config.mts"
37
47
import { defineConfig } from ' @ice/app' ;
38
- import jsxPlus from ' @ice/plugin-jsx-plus ' ;
48
+ import moment from ' @ice/plugin-moment-locales ' ;
39
49
40
50
export default defineConfig (() => ({
41
51
plugins: [
42
- jsxPlus (),
52
+ moment ({
53
+ locales: [' zh-CN' ],
54
+ }),
43
55
],
44
56
}));
45
57
```
46
58
59
+ ##### build-plugin-fusion
60
+ 替换为 ` @ice/plugin-fusion ` ,使用版本 1.1.0+,使用方式:
61
+
62
+ ``` ts title="ice.config.mts"
63
+ import { defineConfig } from ' @ice/app' ;
64
+ import fusion from ' @ice/plugin-fusion' ;
65
+
66
+ export default defineConfig (() => ({
67
+ plugins: [fusion ({
68
+ importStyle: true ,
69
+ themePackage: ' @alifd/theme-design-pro' ,
70
+ theme: {
71
+ ' primary-color' : ' #fff' ,
72
+ },
73
+ })],
74
+ }));
75
+ ```
76
+
77
+ fusion 插件文档:[ 链接] ( ../plugins/plugin-fusion.md )
78
+
79
+ > ice3 下的 fusion 插件不再支持多主题能力,仅支持配置 importStyle、themePackage 和 theme 三个配置项
80
+
81
+ ##### build-plugin-antd
82
+
83
+ 插件替换为 ` @ice/plugin-antd ` ,使用版本 1.0.2+,使用方式:
84
+
85
+ ``` ts title="ice.config.mts"
86
+ import { defineConfig } from ' @ice/app' ;
87
+ import antd from ' @ice/plugin-antd' ;
88
+
89
+ export default defineConfig (() => ({
90
+ plugins: [antd ({
91
+ dark: true ,
92
+ compact: true ,
93
+ theme: {
94
+ ' primary-color' : ' #fd8' ,
95
+ },
96
+ })],
97
+ }));
98
+ ```
99
+
100
+ antd 插件文档:[ 链接] ( ../advanced/antd.md )
101
+
102
+ ##### build-plugin-css-assets-local
103
+
104
+ 插件替换为 ` @ice/plugin-css-assets-local ` ,使用版本 1.0.2+,使用方式:
105
+
106
+ ``` ts title="ice.config.mts"
107
+ import { defineConfig } from ' @ice/app' ;
108
+ import cssAssetsLocal from ' @ice/plugin-css-assets-local' ;
109
+
110
+ export default defineConfig (() => ({
111
+ plugins: [
112
+ cssAssetsLocal (),
113
+ ],
114
+ }));
115
+ ```
116
+
117
+ css-assets-local 插件文档:[ 链接] ( ../advanced/css-assets-local.md )
118
+
119
+ ##### build-plugin-jsx-plus
120
+
121
+ 插件替换为 ` @ice/plugin-jsx-plus ` ,使用版本 1.0.4+,使用方式:
122
+
123
+ ``` ts title="ice.config.mts"
124
+ import { defineConfig } from ' @ice/app' ;
125
+ import jsxplus from ' @ice/plugin-jsx-plus' ;
126
+
127
+ export default defineConfig (() => ({
128
+ plugins: [
129
+ jsxplus ({
130
+ // options
131
+ }),
132
+ ],
133
+ }));
134
+ ```
135
+
136
+ jsx-plus 插件文档:[ 链接] ( ../advanced/jsx-plus.md )
137
+
138
+ ##### build-plugin-keep-alive
139
+
140
+ ice 3 不再支持插件形式的 keep-alive 方案。由框架内置提供的 ` <KeepAliveOutlet /> ` 组件替代。
141
+ keep-alive 插件文档:[ 链接] ( ../advanced/keep-alive.md )
142
+
47
143
> 完成依赖升级后推荐重新安装依赖,即执行 npm update
48
144
49
145
### 工程配置文件升级
50
146
51
147
为了获取更好的类型提示,ice 新版本中推荐使用 ts 文件进行配置,即在项目目录下新增 ` ice.config.mts ` 文件,原 json 中的能力支持情况如下:
52
148
149
+ #### 命令行参数
150
+
151
+ | ice 2.x | ice 3.0 | 备注 |
152
+ | ---- | ---- | ---- |
153
+ | --port | --port | - |
154
+ | --host | --host | - |
155
+ | --config | --config | - |
156
+ | --disable-open | --no-open | - |
157
+ | --disable-mock | --no-mock | - |
158
+ | --https | --https | - |
159
+ | --analyzer | --analyzer | - |
160
+ | --disable-assets | ❌ | 不常用通过环境变量控制日志输出详细程度 |
161
+ | --disable-reload | ❌ | 配置禁止 fastRefresh |
162
+
163
+ #### 配置项
164
+
53
165
| ice 2.x | ice 3.0 | 备注 |
54
166
| ---- | ---- | ---- |
55
- | --port | ✅ | - |
56
- | --host | ✅ | - |
57
- | --config | ✅ | - |
58
- | --disable-open | ✅ | - |
59
167
| plugins | ✅ | - |
60
168
| alias | ✅ | - |
61
169
| publicPath | ✅ | - |
@@ -67,9 +175,6 @@ export default defineConfig(() => ({
67
175
| proxy | ✅ | - |
68
176
| define | ✅ | - |
69
177
| ssr | ✅ | - |
70
- | --disable-mock | ✅ | - |
71
- | --https | ✅ | - |
72
- | --analyzer | ✅ | - |
73
178
| dropLogLevel | ✅ | - |
74
179
| minify | ✅ | 简化配置(true/false) |
75
180
| compileDependencies | ✅ | 配合现有的 compileIncludes 能力 |
@@ -78,8 +183,6 @@ export default defineConfig(() => ({
78
183
| postcssOptions / postcssrc | ✅ | - |
79
184
| polyfill | ✅ | 需要主动开启 |
80
185
| remoteRuntime | ❌ | - |
81
- | --disable-assets | ❌ | 不常用通过环境变量控制日志输出详细程度 |
82
- | --disable-reload | ❌ | 配置禁止 fastRefresh |
83
186
| terser | ❌ | 内置方案 |
84
187
| outputAssetsPath | ❌ | 后续输出最佳目录实践 |
85
188
| devServer | ❌ | 不支持全量配置 devServer,按需开启 server 相关能力 |
@@ -93,7 +196,7 @@ export default defineConfig(() => ({
93
196
| swc | ❌ | - |
94
197
| store / auth / request / pwa / router | ❌ | 通过定制的插件支持 |
95
198
| disableRuntime | ❌ | - |
96
- | babelPlugins / babelPresets / webpackPlugins / webpackLoaders | ❌ | 不推荐直接配置 |
199
+ | babelPlugins / babelPresets / webpackPlugins / webpackLoaders | ❌ | 不推荐直接配置,如果有定制需求通过 webpack 配置进行迁移 |
97
200
98
201
ice.js 3 新版本中不再支持 vite 模式,并且 webpack 相关的快捷配置也不再支持。我们将会将内置的逻辑做到最优。如果存在 webpack 定制需求,可以参考如下自定义方式定制:
99
202
@@ -113,11 +216,11 @@ export default defineConfig(() => ({
113
216
// 修改内置的 webpack 规则,借助官方工具可以更便捷的修改
114
217
// 修改 css 样式规则下的 postcss-loader 配置项
115
218
return modifyLoader (webpackConfig, {
116
- rule: ' .css' ,
117
- loader: ' postcss-loader' ,
118
- options : (originOptions ) => ({}),
119
- });
120
- }
219
+ rule: ' .css' ,
220
+ loader: ' postcss-loader' ,
221
+ options : (originOptions ) => ({}),
222
+ });
223
+ },
121
224
}));
122
225
` ` `
123
226
0 commit comments