Skip to content

Commit

Permalink
fix: 修复独立分包组件没有走子编译器的问题 (#14934)
Browse files Browse the repository at this point in the history 
* fix: 修复独立分包组件没有走子编译器的问题

* refactor: 优化命名

* fix: 根据 pr 调整逻辑

---------

Co-authored-by: xuanzebin <[email protected]>
Co-authored-by: chenjiajian <[email protected]>
  • Loading branch information
@xuanzebin @Chen-jj
3 people authored Dec 18, 2023
1 parent efa0194 commit b0e620e
Showing 1 changed file with 36 additions and 15 deletions.
51 changes: 36 additions & 15 deletions packages/taro-webpack5-runner/src/plugins/MiniPlugin.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,8 @@ interface IOptions extends ITaroMiniPluginOptions {
}
}

type IndependentPackage = { pages: string[], components: string[] }

export interface IComponentObj {
name?: string
path: string | null
Expand Down Expand Up @@ -110,7 +112,7 @@ export default class TaroMiniPlugin {
loadChunksPlugin: TaroLoadChunksPlugin
themeLocation: string
pageLoaderName = '@tarojs/taro-loader/lib/page'
independentPackages = new Map<string, string[]>()
independentPackages = new Map<string, IndependentPackage>()

constructor (options: ITaroMiniPluginOptions) {
const { combination } = options
Expand Down Expand Up @@ -264,7 +266,7 @@ export default class TaroMiniPlugin {
}
} else if (module.miniType === META_TYPE.PAGE) {
let isIndependent = false
this.independentPackages.forEach(pages => {
this.independentPackages.forEach(({ pages }) => {
if (pages.includes(module.resource)) {
isIndependent = true
}
Expand Down Expand Up @@ -440,6 +442,15 @@ export default class TaroMiniPlugin {
return appEntryPath
}

getIndependentPackage (pagePath: string): IndependentPackage | undefined {
return Array.from(this.independentPackages.values()).find(independentPackage => {
const { pages } = independentPackage
if (pages.includes(pagePath)) {
return independentPackage
}
})
}

getChangedFiles (compiler: Compiler) {
return compiler.modifiedFiles
}
Expand Down Expand Up @@ -670,7 +681,10 @@ export default class TaroMiniPlugin {
if (!this.isWatch && this.options.logger?.quiet === false) {
printLog(processTypeEnum.COMPILE, '发现页面', this.getShowPath(page.path))
}
this.compileFile(page)
const pagePath = page.path
const independentPackage = this.getIndependentPackage(pagePath)

this.compileFile(page, independentPackage)
})
}

Expand Down Expand Up @@ -762,7 +776,7 @@ export default class TaroMiniPlugin {
/**
* 读取页面、组件的配置，并递归读取依赖的组件的配置
*/
compileFile (file: IComponent) {
compileFile (file: IComponent, independentPackage?: IndependentPackage) {
const filePath = file.path
const fileConfigPath = file.isNative ? this.replaceExt(filePath, '.json') : this.getConfigFilePath(filePath)
const fileConfig = readConfig(fileConfigPath, this.options.combination.config)
Expand Down Expand Up @@ -831,8 +845,12 @@ export default class TaroMiniPlugin {
stylePath: isNative ? this.getStylePath(componentPath) : undefined,
templatePath: isNative ? this.getTemplatePath(componentPath) : undefined
}

// 收集独立分包的组件，用于后续单独编译
independentPackage?.components?.push(componentPath)

this.components.add(componentObj)
this.compileFile(componentObj)
this.compileFile(componentObj, independentPackage)
}
})
}
Expand All @@ -855,7 +873,7 @@ export default class TaroMiniPlugin {
const root = item.root
const isIndependent = !!item.independent
if (isIndependent) {
this.independentPackages.set(root, [])
this.independentPackages.set(root, { pages: [], components: [] })
}
item.pages.forEach(page => {
let pageItem = `${root}/${page}`
Expand All @@ -871,7 +889,7 @@ export default class TaroMiniPlugin {
const templatePath = this.getTemplatePath(pagePath)
const isNative = this.isNativePageORComponent(templatePath)
if (isIndependent) {
const independentPages = this.independentPackages.get(root)
const independentPages = this.independentPackages.get(root)?.pages
independentPages?.push(pagePath)
}
this.pages.add({
Expand Down Expand Up @@ -908,7 +926,7 @@ export default class TaroMiniPlugin {
const RuntimeChunkPlugin = require('webpack/lib/optimize/RuntimeChunkPlugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')

independentPackages.forEach((pages, name) => {
independentPackages.forEach(({ pages, components }, name) => {
const childCompiler = compilation.createChildCompiler(PLUGIN_NAME, {
path: `${compiler.options.output.path}/${name}`,
chunkLoadingGlobal: `subpackage_${name}`
Expand Down Expand Up @@ -962,6 +980,14 @@ export default class TaroMiniPlugin {
})
dependencies.delete(pagePath)
})
components.forEach(componentPath => {
if (dependencies.has(componentPath)) {
const dep = dependencies.get(componentPath)
new TaroSingleEntryPlugin(compiler.context, dep?.request, dep?.name, dep?.miniType, dep?.options).apply(childCompiler)
}

dependencies.delete(componentPath)
})
new TaroLoadChunksPlugin({
commonChunks: [`${name}/runtime`, `${name}/vendors`, `${name}/common`],
isBuildPlugin: false,
Expand Down Expand Up @@ -1099,7 +1125,7 @@ export default class TaroMiniPlugin {
const config = this.filesConfig[this.getConfigFilePath(page.name)]
let isIndependent = false
let independentName = ''
this.independentPackages.forEach((pages, name) => {
this.independentPackages.forEach(({ pages }, name) => {
// independentPackages 是包含了所有 ChildCompiler 的资源，如果不是当前 ChildCompiler 的资源不做处理
if (pages.includes(page.path) && name === childName) {
isIndependent = true
Expand Down Expand Up @@ -1208,13 +1234,8 @@ export default class TaroMiniPlugin {
this.pages.forEach(page => {
const importBaseTemplatePath = promoteRelativePath(path.relative(page.path, path.join(sourceDir, this.getTemplatePath(baseTemplateName))))
const config = this.filesConfig[this.getConfigFilePath(page.name)]
let isIndependent = false
// pages 里面会混合独立分包的，在这里需要过滤一下，避免重复生成 assets
this.independentPackages.forEach(pages => {
if (pages.includes(page.path)) {
isIndependent = true
}
})
const isIndependent = !!this.getIndependentPackage(page.path)

if (isIndependent) return

Expand Down

0 comments on commit b0e620e

Please sign in to comment.