@taro-minify-pack/plugin-async-pack 0.1.3-alpha.1 → 0.1.3
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 +20 -4
- package/dist/utils.js +3 -2
- package/dist/utils.js.map +1 -1
- package/package.json +1 -1
- package/src/utils.ts +3 -2
package/README.md
CHANGED
|
@@ -178,11 +178,11 @@ plugins: [
|
|
|
178
178
|
customDynamicPackages: [
|
|
179
179
|
{
|
|
180
180
|
name: 'sync-style',
|
|
181
|
-
test: (module) => /src[\\/]pages[\\/]sync-style[\\/]/.test(module.
|
|
181
|
+
test: (module) => /src[\\/]pages[\\/]sync-style[\\/]/.test(module.identifier()),
|
|
182
182
|
},
|
|
183
183
|
{
|
|
184
184
|
name: 'async-style',
|
|
185
|
-
test: (module) => /src[\\/]pages[\\/]async-style[\\/]/.test(module.
|
|
185
|
+
test: (module) => /src[\\/]pages[\\/]async-style[\\/]/.test(module.identifier()),
|
|
186
186
|
asyncStyle: true
|
|
187
187
|
}
|
|
188
188
|
]
|
|
@@ -200,8 +200,24 @@ plugins: [
|
|
|
200
200
|
- 确认使用了 Webpack 5 编译器
|
|
201
201
|
- 确保代码中使用了 `import()` 动态导入语法
|
|
202
202
|
|
|
203
|
-
### 2.
|
|
204
|
-
-
|
|
203
|
+
### 2. 为什么样式文件没有异步？
|
|
204
|
+
- 先检查 `customDynamicPackages[].test` 是否真的命中了目标模块；如果没有命中，样式会走默认同步合并逻辑，而不会进入对应自定义异步分包
|
|
205
|
+
- 再检查该自定义分包的 `asyncStyle` 是否为 `true`；只有开启后才会额外生成 `inject-style` 组件，并触发异步样式注入
|
|
206
|
+
- `module.identifier()` 代表 webpack 给当前模块生成的唯一标识，通常会包含 loader 链、查询参数和源文件绝对路径，比单纯看文件名更适合排查 `test` 是否命中
|
|
207
|
+
- 排查时可以先在 `test` 回调里临时打印 `module.identifier()`，确认真实值后再收窄正则规则，例如只匹配其中稳定的源码路径片段：
|
|
208
|
+
|
|
209
|
+
```js
|
|
210
|
+
const customDynamicPackageConfig = {
|
|
211
|
+
name: 'async-style',
|
|
212
|
+
test: (module) => {
|
|
213
|
+
console.log(module.identifier())
|
|
214
|
+
return /src[\\/]pages[\\/]async-style[\\/]/.test(module.identifier())
|
|
215
|
+
},
|
|
216
|
+
asyncStyle: true
|
|
217
|
+
}
|
|
218
|
+
```
|
|
219
|
+
|
|
220
|
+
- 如果打印出来的内容带有 `css-loader`、`sass-loader`、`?taro` 之类前缀或查询参数，通常是正常现象，优先匹配其中稳定的业务目录路径即可
|
|
205
221
|
|
|
206
222
|
### 3. 配置后编译失败？
|
|
207
223
|
- 请检查配置选项是否正确
|
package/dist/utils.js
CHANGED
|
@@ -16,7 +16,7 @@ const generateKeyByOrder = (order) => {
|
|
|
16
16
|
exports.generateKeyByOrder = generateKeyByOrder;
|
|
17
17
|
const generateDefaultDynamicPackageName = (opt) => {
|
|
18
18
|
if (!(0, exports.isNumber)(opt.order) || opt.dynamicPackageCount <= 1)
|
|
19
|
-
return opt.dynamicPackageNamePrefix
|
|
19
|
+
return `${opt.dynamicPackageNamePrefix}-default`;
|
|
20
20
|
return `${opt.dynamicPackageNamePrefix}-${(0, exports.generateKeyByOrder)(opt.order)}`;
|
|
21
21
|
};
|
|
22
22
|
exports.generateDefaultDynamicPackageName = generateDefaultDynamicPackageName;
|
|
@@ -53,7 +53,8 @@ const isDynamicPackageAsset = (opt, assetName) => {
|
|
|
53
53
|
};
|
|
54
54
|
exports.isDynamicPackageAsset = isDynamicPackageAsset;
|
|
55
55
|
const isAsyncStyleDynamicPackageAsset = (opt, assetName) => {
|
|
56
|
-
const
|
|
56
|
+
const asyncStyleDynamicPackages = opt.customDynamicPackages.filter(item => item.asyncStyle);
|
|
57
|
+
const asyncStylDynamicPackageNames = asyncStyleDynamicPackages.map(item => (0, exports.generateCustomDynamicPackageName)(opt, item.name));
|
|
57
58
|
if (!asyncStylDynamicPackageNames.length)
|
|
58
59
|
return false;
|
|
59
60
|
return new RegExp(`^(${asyncStylDynamicPackageNames.join('|')})/`).test(assetName);
|
package/dist/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":";;;AAGO,MAAM,aAAa,GAAG,CAAC,IAAY,EAAE,GAAW,EAAE,EAAE;IACzD,IAAI,CAAC,IAAI,IAAI,GAAG,IAAI,CAAC;QAAE,OAAO,CAAC,CAAA;IAC/B,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAA;AAClD,CAAC,CAAA;AAHY,QAAA,aAAa,iBAGzB;AAEM,MAAM,kBAAkB,GAAG,CAAC,KAAa,EAAE,EAAE;IAClD,MAAM,QAAQ,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAA;IAClC,MAAM,WAAW,GAAG,MAAM,CAAC,YAAY,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,CAAA;IAC1E,MAAM,YAAY,GAAG,MAAM,CAAC,YAAY,CAAC,QAAQ,GAAG,KAAK,GAAG,EAAE,CAAC,CAAA;IAC/D,OAAO,GAAG,WAAW,GAAG,YAAY,EAAE,CAAA;AACxC,CAAC,CAAA;AALY,QAAA,kBAAkB,sBAK9B;AAEM,MAAM,iCAAiC,GAAG,CAAC,GAAuC,EAAE,EAAE;IAC3F,IAAI,CAAC,IAAA,gBAAQ,EAAC,GAAG,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,mBAAmB,IAAI,CAAC;QAAE,OAAO,GAAG,CAAC,wBAAwB,CAAA;
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/utils.ts
CHANGED
|
@@ -14,7 +14,7 @@ export const generateKeyByOrder = (order: number) => {
|
|
|
14
14
|
}
|
|
15
15
|
|
|
16
16
|
export const generateDefaultDynamicPackageName = (opt: AsyncPackOpts & { order?: number }) => {
|
|
17
|
-
if (!isNumber(opt.order) || opt.dynamicPackageCount <= 1) return opt.dynamicPackageNamePrefix
|
|
17
|
+
if (!isNumber(opt.order) || opt.dynamicPackageCount <= 1) return `${opt.dynamicPackageNamePrefix}-default`
|
|
18
18
|
return `${opt.dynamicPackageNamePrefix}-${generateKeyByOrder(opt.order!)}`
|
|
19
19
|
}
|
|
20
20
|
|
|
@@ -49,7 +49,8 @@ export const isDynamicPackageAsset = (opt: AsyncPackOpts, assetName: string) =>
|
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
export const isAsyncStyleDynamicPackageAsset = (opt: AsyncPackOpts, assetName: string) => {
|
|
52
|
-
const
|
|
52
|
+
const asyncStyleDynamicPackages = opt.customDynamicPackages.filter(item => item.asyncStyle)
|
|
53
|
+
const asyncStylDynamicPackageNames = asyncStyleDynamicPackages.map(item => generateCustomDynamicPackageName(opt, item.name))
|
|
53
54
|
if (!asyncStylDynamicPackageNames.length) return false
|
|
54
55
|
return new RegExp(`^(${asyncStylDynamicPackageNames.join('|')})/`).test(assetName)
|
|
55
56
|
}
|