@tarojs/webpack5-runner 3.8.0-canary.0 → 3.8.0-canary.1

package/dist/plugins/MiniPlugin.js

@@ -31,7 +31,7 @@ function isLoaderExist(loaders, loaderName) {
     return loaders.some(item => item.loader === loaderName);
 }
 class TaroMiniPlugin {
-    constructor(options = {}) {
+    constructor(options) {
         /** app、页面、组件的配置集合 */
         this.filesConfig = {};
         this.isWatch = false;
@@ -42,29 +42,35 @@ class TaroMiniPlugin {
         this.nativeComponents = new Map();
         /** tabbar icon 图片路径列表 */
         this.tabBarIcons = new Set();
+        this.prerenderPages = new Set();
         this.dependencies = new Map();
         this.pageLoaderName = '@tarojs/taro-loader/lib/page';
         this.independentPackages = new Map();
-        this.options = Object.assign({
-            sourceDir: '',
-            framework: 'nerv',
-            commonChunks: ['runtime', 'vendors'],
-            isBuildPlugin: false,
-            fileType: {
-                style: '.wxss',
-                config: '.json',
-                script: '.js',
-                templ: '.wxml',
-                xs: '.wxs'
-            },
-            minifyXML: {},
-            hot: false
-        }, options);
-        const { template, baseLevel } = this.options;
+        const { combination } = options;
+        const miniBuildConfig = combination.config;
+        const { template, baseLevel = 16 } = miniBuildConfig;
+        this.options = {
+            sourceDir: combination.sourceDir,
+            framework: miniBuildConfig.framework || 'react',
+            frameworkExts: miniBuildConfig.frameworkExts || [],
+            template,
+            runtimePath: miniBuildConfig.runtimePath || '',
+            isBuildPlugin: miniBuildConfig.isBuildPlugin || false,
+            blended: miniBuildConfig.blended || false,
+            newBlended: miniBuildConfig.newBlended || false,
+            logger: miniBuildConfig.logger,
+            skipProcessUsingComponents: miniBuildConfig.skipProcessUsingComponents || false,
+            fileType: miniBuildConfig.fileType,
+            combination,
+            commonChunks: options.commonChunks || ['runtime', 'vendors'],
+            constantsReplaceList: options.constantsReplaceList,
+            pxTransformConfig: options.pxTransformConfig,
+            hot: options.hot,
+            loaderMeta: options.loaderMeta || {},
+        };
         if (template.isSupportRecursive === false && baseLevel > 0) {
             template.baseLevel = baseLevel;
         }
-        this.prerenderPages = new Set();
     }
     /**
      * 自动驱动 tapAsync
@@ -86,14 +92,15 @@ class TaroMiniPlugin {
     apply(compiler) {
         this.context = compiler.context;
         this.appEntry = this.getAppEntry(compiler);
-        const { commonChunks, addChunkPages, framework, isBuildPlugin, newBlended, } = this.options;
+        const { commonChunks, combination, framework, isBuildPlugin, newBlended, } = this.options;
+        const { addChunkPages, onCompilerMake, modifyBuildAssets, onParseCreateElement, } = combination.config;
         /** build mode */
         compiler.hooks.run.tapAsync(PLUGIN_NAME, this.tryAsync((compiler) => __awaiter(this, void 0, void 0, function* () {
             yield this.run(compiler);
             new TaroLoadChunksPlugin_1.default({
                 commonChunks: commonChunks,
                 isBuildPlugin,
-                addChunkPages: addChunkPages,
+                addChunkPages,
                 pages: this.pages,
                 framework: framework
             }).apply(compiler);
@@ -109,7 +116,7 @@ class TaroMiniPlugin {
                 this.loadChunksPlugin = new TaroLoadChunksPlugin_1.default({
                     commonChunks: commonChunks,
                     isBuildPlugin,
-                    addChunkPages: addChunkPages,
+                    addChunkPages,
                     pages: this.pages,
                     framework: framework
                 });
@@ -118,7 +125,6 @@ class TaroMiniPlugin {
         })));
         /** compilation.addEntry */
         compiler.hooks.make.tapAsync(PLUGIN_NAME, this.tryAsync((compilation) => __awaiter(this, void 0, void 0, function* () {
-            var _a, _b;
             const dependencies = this.dependencies;
             const promises = [];
             this.compileIndependentPages(compiler, compilation, dependencies, promises);
@@ -128,7 +134,7 @@ class TaroMiniPlugin {
                 }));
             });
             yield Promise.all(promises);
-            yield ((_b = (_a = this.options).onCompilerMake) === null || _b === void 0 ? void 0 : _b.call(_a, compilation, compiler, this));
+            yield (onCompilerMake === null || onCompilerMake === void 0 ? void 0 : onCompilerMake(compilation, compiler, this));
         })));
         compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation, { normalModuleFactory }) => {
             /** For Webpack compilation get factory from compilation.dependencyFactories by denpendence's constructor */
@@ -160,7 +166,7 @@ class TaroMiniPlugin {
                 }
                 else if (module.miniType === helper_1.META_TYPE.PAGE) {
                     let isIndependent = false;
-                    this.independentPackages.forEach(pages => {
+                    this.independentPackages.forEach(({ pages }) => {
                         if (pages.includes(module.resource)) {
                             isIndependent = true;
                         }
@@ -230,7 +236,6 @@ class TaroMiniPlugin {
                 // 该 stage 是最后执行的，确保 taro 暴露给用户的钩子 modifyBuildAssets 在内部处理完 assets 之后再调用
                 stage: PROCESS_ASSETS_STAGE_REPORT
             }, this.tryAsync(() => __awaiter(this, void 0, void 0, function* () {
-                const { modifyBuildAssets } = this.options;
                 if (typeof modifyBuildAssets === 'function') {
                     yield modifyBuildAssets(compilation.assets, this);
                 }
@@ -239,7 +244,7 @@ class TaroMiniPlugin {
         compiler.hooks.afterEmit.tapAsync(PLUGIN_NAME, this.tryAsync((compilation) => __awaiter(this, void 0, void 0, function* () {
             yield this.addTarBarFilesToDependencies(compilation);
         })));
-        new TaroNormalModulesPlugin_1.default(this.options.onParseCreateElement).apply(compiler);
+        new TaroNormalModulesPlugin_1.default(onParseCreateElement).apply(compiler);
         newBlended && this.addLoadChunksPlugin(compiler);
     }
     addLoadChunksPlugin(compiler) {
@@ -306,10 +311,6 @@ class TaroMiniPlugin {
             compiler.options.entry = {};
             return entryCopy;
         }
-        if (this.options.appEntry) {
-            compiler.options.entry = {};
-            return this.options.appEntry;
-        }
         function getEntryPath(entry) {
             const app = entry.app;
             if (Array.isArray(app)) {
@@ -324,6 +325,14 @@ class TaroMiniPlugin {
         compiler.options.entry = {};
         return appEntryPath;
     }
+    getIndependentPackage(pagePath) {
+        return Array.from(this.independentPackages.values()).find(independentPackage => {
+            const { pages } = independentPackage;
+            if (pages.includes(pagePath)) {
+                return independentPackage;
+            }
+        });
+    }
     getChangedFiles(compiler) {
         return compiler.modifiedFiles;
     }
@@ -332,26 +341,29 @@ class TaroMiniPlugin {
      * 往 this.dependencies 中添加资源模块
      */
     run(compiler) {
-        if (this.options.isBuildPlugin) {
-            this.getPluginFiles();
-            this.getConfigFiles(compiler);
-        }
-        else {
-            this.appConfig = this.getAppConfig();
-            this.getPages();
-            this.getPagesConfig();
-            this.getDarkMode();
-            this.getConfigFiles(compiler);
-            this.addEntries();
-        }
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.options.isBuildPlugin) {
+                this.getPluginFiles();
+                this.getConfigFiles(compiler);
+            }
+            else {
+                this.appConfig = yield this.getAppConfig();
+                this.getPages();
+                this.getPagesConfig();
+                this.getDarkMode();
+                this.getConfigFiles(compiler);
+                this.addEntries();
+            }
+        });
     }
     getPluginFiles() {
         const fileList = new Set();
-        const { pluginConfig, template } = this.options;
+        const { template, combination } = this.options;
+        const { pluginConfig, pluginMainEntry } = combination.buildNativePlugin;
         const normalFiles = new Set();
         Object.keys(this.appEntry).forEach(key => {
             const filePath = this.appEntry[key][0] || this.appEntry[key].import[0];
-            if (key === this.options.pluginMainEntry) {
+            if (key === pluginMainEntry) {
                 this.addEntry(filePath, key, helper_1.META_TYPE.EXPORTS);
             }
             if (pluginConfig) {
@@ -365,14 +377,14 @@ class TaroMiniPlugin {
                 Object.keys(pluginConfig).forEach(pluginKey => {
                     if (pluginKey === 'pages') {
                         Object.keys(pluginConfig[pluginKey]).forEach(pageKey => {
-                            if (`plugin/${pluginConfig[pluginKey][pageKey]}` === key) {
+                            if (`${pluginConfig[pluginKey][pageKey]}` === key) {
                                 isPage = true;
                             }
                         });
                     }
                     if (pluginKey === 'publicComponents') {
                         Object.keys(pluginConfig[pluginKey]).forEach(pageKey => {
-                            if (`plugin/${pluginConfig[pluginKey][pageKey]}` === key) {
+                            if (`${pluginConfig[pluginKey][pageKey]}` === key) {
                                 isComponent = true;
                             }
                         });
@@ -402,9 +414,9 @@ class TaroMiniPlugin {
             }
         });
         if (!template.isSupportRecursive) {
-            this.addEntry(path_1.default.resolve(__dirname, '..', 'template/comp'), this.getIsBuildPluginPath('comp', true), helper_1.META_TYPE.STATIC);
+            this.addEntry(path_1.default.resolve(__dirname, '..', 'template/comp'), 'comp', helper_1.META_TYPE.STATIC);
         }
-        this.addEntry(path_1.default.resolve(__dirname, '..', 'template/custom-wrapper'), this.getIsBuildPluginPath('custom-wrapper', true), helper_1.META_TYPE.STATIC);
+        this.addEntry(path_1.default.resolve(__dirname, '..', 'template/custom-wrapper'), 'custom-wrapper', helper_1.META_TYPE.STATIC);
         normalFiles.forEach(item => {
             this.addEntry(item.path, item.name, helper_1.META_TYPE.NORMAL, {
                 library: {
@@ -469,18 +481,24 @@ class TaroMiniPlugin {
      * @returns app config 配置内容
      */
     getAppConfig() {
-        const appName = path_1.default.basename(this.appEntry).replace(path_1.default.extname(this.appEntry), '');
-        this.compileFile({
-            name: appName,
-            path: this.appEntry,
-            isNative: false
+        return __awaiter(this, void 0, void 0, function* () {
+            const appName = path_1.default.basename(this.appEntry).replace(path_1.default.extname(this.appEntry), '');
+            this.compileFile({
+                name: appName,
+                path: this.appEntry,
+                isNative: false
+            });
+            const fileConfig = this.filesConfig[this.getConfigFilePath(appName)];
+            const appConfig = fileConfig ? fileConfig.content || {} : {};
+            if ((0, helper_1.isEmptyObject)(appConfig)) {
+                throw new Error('缺少 app 全局配置文件，请检查！');
+            }
+            const { modifyAppConfig } = this.options.combination.config;
+            if (typeof modifyAppConfig === 'function') {
+                yield modifyAppConfig(appConfig);
+            }
+            return appConfig;
         });
-        const fileConfig = this.filesConfig[this.getConfigFilePath(appName)];
-        const appConfig = fileConfig ? fileConfig.content || {} : {};
-        if ((0, helper_1.isEmptyObject)(appConfig)) {
-            throw new Error('缺少 app 全局配置文件，请检查！');
-        }
-        return appConfig;
     }
     /**
      * 根据 app config 的 pages 配置项，收集所有页面信息，
@@ -488,7 +506,6 @@ class TaroMiniPlugin {
      */
     getPages() {
         var _a;
-        const { newBlended } = this.options;
         if ((0, helper_1.isEmptyObject)(this.appConfig)) {
             throw new Error('缺少 app 全局配置文件，请检查！');
         }
@@ -499,7 +516,8 @@ class TaroMiniPlugin {
         if (!this.isWatch && ((_a = this.options.logger) === null || _a === void 0 ? void 0 : _a.quiet) === false) {
             (0, helper_1.printLog)("compile" /* processTypeEnum.COMPILE */, '发现入口', this.getShowPath(this.appEntry));
         }
-        const { frameworkExts, prerender } = this.options;
+        const { newBlended, frameworkExts, combination } = this.options;
+        const { prerender } = combination.config;
         this.prerenderPages = new Set((0, prerender_1.validatePrerenderPages)(appPages, prerender).map(p => p.path));
         this.getTabBarFiles(this.appConfig);
         this.pages = new Set([
@@ -551,7 +569,9 @@ class TaroMiniPlugin {
             if (!this.isWatch && ((_a = this.options.logger) === null || _a === void 0 ? void 0 : _a.quiet) === false) {
                 (0, helper_1.printLog)("compile" /* processTypeEnum.COMPILE */, '发现页面', this.getShowPath(page.path));
             }
-            this.compileFile(page);
+            const pagePath = page.path;
+            const independentPackage = this.getIndependentPackage(pagePath);
+            this.compileFile(page, independentPackage);
         });
     }
     /**
@@ -640,12 +660,12 @@ class TaroMiniPlugin {
     /**
      * 读取页面、组件的配置，并递归读取依赖的组件的配置
      */
-    compileFile(file) {
+    compileFile(file, independentPackage) {
+        var _a;
         const filePath = file.path;
         const fileConfigPath = file.isNative ? this.replaceExt(filePath, '.json') : this.getConfigFilePath(filePath);
-        const fileConfig = (0, helper_1.readConfig)(fileConfigPath);
-        const { componentGenerics } = fileConfig;
-        const usingComponents = fileConfig.usingComponents;
+        const fileConfig = (0, helper_1.readConfig)(fileConfigPath, this.options.combination.config);
+        const { componentGenerics, usingComponents } = fileConfig;
         if (this.options.isBuildPlugin && componentGenerics) {
             Object.keys(componentGenerics).forEach(component => {
                 if (componentGenerics[component]) {
@@ -659,7 +679,8 @@ class TaroMiniPlugin {
         if (usingComponents) {
             const componentNames = Object.keys(usingComponents);
             const depComponents = [];
-            const alias = this.options.alias;
+            // alias 的值需要从最终的 chain 中拿，避免用户在 webpackChain 中设置的 alias 无法被读取到
+            const alias = (_a = this.options.combination.chain.toConfig().resolve) === null || _a === void 0 ? void 0 : _a.alias;
             for (const compName of componentNames) {
                 let compPath = usingComponents[compName];
                 if ((0, helper_1.isAliasPath)(compPath, alias)) {
@@ -668,9 +689,9 @@ class TaroMiniPlugin {
                 }
                 // 判断是否为第三方依赖的正则，如果 test 为 false 则为第三方依赖
                 const notNpmPkgReg = /^[.\\/]/;
-                if (!this.options.skipProcessUsingComponents
-                    && !compPath.startsWith('plugin://')
-                    && !notNpmPkgReg.test(compPath)) {
+                if (!this.options.skipProcessUsingComponents &&
+                    !compPath.startsWith('plugin://') &&
+                    !notNpmPkgReg.test(compPath)) {
                     const tempCompPath = (0, helper_1.getNpmPackageAbsolutePath)(compPath);
                     if (tempCompPath) {
                         compPath = tempCompPath;
@@ -686,6 +707,7 @@ class TaroMiniPlugin {
                 }
             }
             depComponents.forEach(item => {
+                var _a;
                 const componentPath = (0, helper_1.resolveMainFilePath)(path_1.default.resolve(path_1.default.dirname(file.path), item.path));
                 if (helper_1.fs.existsSync(componentPath) && !Array.from(this.components).some(item => item.path === componentPath)) {
                     const componentName = this.getComponentName(componentPath);
@@ -701,8 +723,10 @@ class TaroMiniPlugin {
                         stylePath: isNative ? this.getStylePath(componentPath) : undefined,
                         templatePath: isNative ? this.getTemplatePath(componentPath) : undefined
                     };
+                    // 收集独立分包的组件，用于后续单独编译
+                    (_a = independentPackage === null || independentPackage === void 0 ? void 0 : independentPackage.components) === null || _a === void 0 ? void 0 : _a.push(componentPath);
                     this.components.add(componentObj);
-                    this.compileFile(componentObj);
+                    this.compileFile(componentObj, independentPackage);
                 }
             });
         }
@@ -723,9 +747,10 @@ 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 => {
+                        var _a;
                         let pageItem = `${root}/${page}`;
                         pageItem = pageItem.replace(/\/{2,}/g, '/');
                         let hasPageIn = false;
@@ -739,7 +764,7 @@ class TaroMiniPlugin {
                             const templatePath = this.getTemplatePath(pagePath);
                             const isNative = this.isNativePageORComponent(templatePath);
                             if (isIndependent) {
-                                const independentPages = this.independentPackages.get(root);
+                                const independentPages = (_a = this.independentPackages.get(root)) === null || _a === void 0 ? void 0 : _a.pages;
                                 independentPages === null || independentPages === void 0 ? void 0 : independentPages.push(pagePath);
                             }
                             this.pages.add({
@@ -773,7 +798,7 @@ class TaroMiniPlugin {
             const SplitChunksPlugin = require('webpack/lib/optimize/SplitChunksPlugin');
             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}`
@@ -827,10 +852,17 @@ class TaroMiniPlugin {
                     });
                     dependencies.delete(pagePath);
                 });
+                components.forEach(componentPath => {
+                    if (dependencies.has(componentPath)) {
+                        const dep = dependencies.get(componentPath);
+                        new TaroSingleEntryPlugin_1.default(compiler.context, dep === null || dep === void 0 ? void 0 : dep.request, dep === null || dep === void 0 ? void 0 : dep.name, dep === null || dep === void 0 ? void 0 : dep.miniType, dep === null || dep === void 0 ? void 0 : dep.options).apply(childCompiler);
+                    }
+                    dependencies.delete(componentPath);
+                });
                 new TaroLoadChunksPlugin_1.default({
                     commonChunks: [`${name}/runtime`, `${name}/vendors`, `${name}/common`],
                     isBuildPlugin: false,
-                    addChunkPages: this.options.addChunkPages,
+                    addChunkPages: this.options.combination.config.addChunkPages,
                     pages: childPages,
                     framework: this.options.framework,
                     isIndependentPackages: true,
@@ -921,8 +953,8 @@ class TaroMiniPlugin {
     /** 生成小程序独立分包的相关文件 */
     generateIndependentMiniFiles(compilation, compiler) {
         return __awaiter(this, void 0, void 0, function* () {
-            const { template, isBuildPlugin, sourceDir } = this.options;
-            const baseTemplateName = this.getIsBuildPluginPath('base', isBuildPlugin);
+            const { template, sourceDir } = this.options;
+            const baseTemplateName = 'base';
             const isUsingCustomWrapper = component_1.componentConfig.thirdPartyComponents.has('custom-wrapper');
             // @ts-ignore
             const childName = compilation.__name;
@@ -950,14 +982,14 @@ class TaroMiniPlugin {
                     }
                 });
                 this.generateTemplateFile(compilation, compiler, `${name}/${customWrapperName}`, template.buildCustomComponentTemplate, this.options.fileType.templ);
-                this.generateXSFile(compilation, compiler, `${name}/utils`, isBuildPlugin);
+                this.generateXSFile(compilation, compiler, `${name}/utils`);
             });
             this.pages.forEach(page => {
                 let importBaseTemplatePath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, this.getTemplatePath(baseTemplateName))));
                 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;
@@ -967,9 +999,13 @@ class TaroMiniPlugin {
                 });
                 if (!isIndependent)
                     return;
+                // 生成页面模板需要在生成页面配置之前，因为会依赖到页面配置的部分内容
+                if (!page.isNative) {
+                    this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath, config);
+                }
                 if (config) {
-                    const importBaseCompPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, independentName, this.getTargetFilePath(this.getIsBuildPluginPath(baseCompName, isBuildPlugin), ''))));
-                    const importCustomWrapperPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, independentName, this.getTargetFilePath(this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), ''))));
+                    const importBaseCompPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, independentName, this.getTargetFilePath(baseCompName, ''))));
+                    const importCustomWrapperPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, independentName, this.getTargetFilePath(customWrapperName, ''))));
                     config.content.usingComponents = Object.assign({}, config.content.usingComponents);
                     if (isUsingCustomWrapper) {
                         config.content.usingComponents[customWrapperName] = importCustomWrapperPath;
@@ -979,9 +1015,6 @@ class TaroMiniPlugin {
                     }
                     this.generateConfigFile(compilation, compiler, page.path, config.content);
                 }
-                if (!page.isNative) {
-                    this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath);
-                }
             });
         });
     }
@@ -989,8 +1022,9 @@ class TaroMiniPlugin {
     generateMiniFiles(compilation, compiler) {
         return __awaiter(this, void 0, void 0, function* () {
             const { RawSource } = compiler.webpack.sources;
-            const { template, modifyMiniConfigs, isBuildPlugin, sourceDir } = this.options;
-            const baseTemplateName = this.getIsBuildPluginPath('base', isBuildPlugin);
+            const { template, combination, isBuildPlugin, sourceDir } = this.options;
+            const { modifyMiniConfigs } = combination.config;
+            const baseTemplateName = 'base';
             const isUsingCustomWrapper = component_1.componentConfig.thirdPartyComponents.has('custom-wrapper');
             /**
              * 与原生小程序混写时解析模板与样式
@@ -1013,7 +1047,7 @@ class TaroMiniPlugin {
             }
             if (!template.isSupportRecursive) {
                 // 如微信、QQ 不支持递归模版的小程序，需要使用自定义组件协助递归
-                this.generateTemplateFile(compilation, compiler, this.getIsBuildPluginPath(baseCompName, isBuildPlugin), template.buildBaseComponentTemplate, this.options.fileType.templ);
+                this.generateTemplateFile(compilation, compiler, baseCompName, template.buildBaseComponentTemplate, this.options.fileType.templ);
                 const baseCompConfig = {
                     component: true,
                     usingComponents: {
@@ -1022,19 +1056,20 @@ class TaroMiniPlugin {
                 };
                 if (isUsingCustomWrapper) {
                     baseCompConfig.usingComponents[customWrapperName] = `./${customWrapperName}`;
-                    this.generateConfigFile(compilation, compiler, this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), {
+                    this.generateConfigFile(compilation, compiler, customWrapperName, {
                         component: true,
+                        styleIsolation: 'apply-shared',
                         usingComponents: {
                             [baseCompName]: `./${baseCompName}`,
                             [customWrapperName]: `./${customWrapperName}`
                         }
                     });
                 }
-                this.generateConfigFile(compilation, compiler, this.getIsBuildPluginPath(baseCompName, isBuildPlugin), baseCompConfig);
+                this.generateConfigFile(compilation, compiler, baseCompName, baseCompConfig);
             }
             else {
                 if (isUsingCustomWrapper) {
-                    this.generateConfigFile(compilation, compiler, this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), {
+                    this.generateConfigFile(compilation, compiler, customWrapperName, {
                         component: true,
                         usingComponents: {
                             [customWrapperName]: `./${customWrapperName}`
@@ -1042,19 +1077,11 @@ class TaroMiniPlugin {
                     });
                 }
             }
-            const buildBaseTemplate = function (...args) {
-                const xmlsOutputDir = path_1.default.join(compiler.outputPath, './taro_xmls');
-                const list = helper_1.fs.existsSync(xmlsOutputDir) ? helper_1.fs.readdirSync(xmlsOutputDir) : [];
-                return list.reduce((pre, cur) => {
-                    const xmlPath = path_1.default.join(xmlsOutputDir, cur);
-                    return pre + `\n<import src="${path_1.default.relative(compiler.outputPath, xmlPath)}"/>`;
-                }, template.buildTemplate(...args));
-            };
-            this.generateTemplateFile(compilation, compiler, baseTemplateName, buildBaseTemplate, component_1.componentConfig);
-            isUsingCustomWrapper && this.generateTemplateFile(compilation, compiler, this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), template.buildCustomComponentTemplate, this.options.fileType.templ);
-            this.generateXSFile(compilation, compiler, 'utils', isBuildPlugin);
+            this.generateTemplateFile(compilation, compiler, baseTemplateName, template.buildTemplate, component_1.componentConfig);
+            isUsingCustomWrapper && this.generateTemplateFile(compilation, compiler, customWrapperName, template.buildCustomComponentTemplate, this.options.fileType.templ);
+            this.generateXSFile(compilation, compiler, 'utils');
             this.components.forEach(component => {
-                const importBaseTemplatePath = (0, helper_1.promoteRelativePath)(path_1.default.relative(component.path, path_1.default.join(sourceDir, this.getTemplatePath(baseTemplateName))));
+                const importBaseTemplatePath = (0, helper_1.promoteRelativePath)(path_1.default.relative(component.path, path_1.default.join(sourceDir, isBuildPlugin ? 'plugin' : '', this.getTemplatePath(baseTemplateName))));
                 const config = this.filesConfig[this.getConfigFilePath(component.name)];
                 if (config) {
                     this.generateConfigFile(compilation, compiler, component.path, config.content);
@@ -1064,20 +1091,19 @@ class TaroMiniPlugin {
                 }
             });
             this.pages.forEach(page => {
-                const importBaseTemplatePath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, this.getTemplatePath(baseTemplateName))));
+                const importBaseTemplatePath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, isBuildPlugin ? 'plugin' : '', 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;
+                // 生成页面模板需要在生成页面配置之前，因为会依赖到页面配置的部分内容
+                if (!page.isNative) {
+                    this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath, config);
+                }
                 if (config) {
-                    const importBaseCompPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, this.getTargetFilePath(this.getIsBuildPluginPath(baseCompName, isBuildPlugin), ''))));
-                    const importCustomWrapperPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, this.getTargetFilePath(this.getIsBuildPluginPath(customWrapperName, isBuildPlugin), ''))));
+                    const importBaseCompPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, this.getTargetFilePath(baseCompName, ''))));
+                    const importCustomWrapperPath = (0, helper_1.promoteRelativePath)(path_1.default.relative(page.path, path_1.default.join(sourceDir, this.getTargetFilePath(customWrapperName, ''))));
                     config.content.usingComponents = Object.assign({}, config.content.usingComponents);
                     if (isUsingCustomWrapper) {
                         config.content.usingComponents[customWrapperName] = importCustomWrapperPath;
@@ -1087,9 +1113,6 @@ class TaroMiniPlugin {
                     }
                     this.generateConfigFile(compilation, compiler, page.path, config.content);
                 }
-                if (!page.isNative) {
-                    this.generateTemplateFile(compilation, compiler, page.path, template.buildPageTemplate, importBaseTemplatePath);
-                }
             });
             this.generateTabBarFiles(compilation, compiler);
             this.injectCommonStyles(compilation, compiler);
@@ -1101,8 +1124,7 @@ class TaroMiniPlugin {
                 if (helper_1.fs.existsSync(pluginJSONPath)) {
                     const pluginJSON = helper_1.fs.readJSONSync(pluginJSONPath);
                     this.modifyPluginJSON(pluginJSON);
-                    const relativePath = pluginJSONPath.replace(sourceDir, '').replace(/\\/g, '/');
-                    compilation.assets[relativePath] = new RawSource(JSON.stringify(pluginJSON));
+                    compilation.assets['plugin.json'] = new RawSource(JSON.stringify(pluginJSON));
                 }
             }
         });
@@ -1131,7 +1153,7 @@ class TaroMiniPlugin {
     generateConfigFile(compilation, compiler, filePath, config) {
         const { RawSource } = compiler.webpack.sources;
         const fileConfigName = this.getConfigPath(this.getComponentName(filePath));
-        const unofficialConfigs = ['enableShareAppMessage', 'enableShareTimeline', 'components'];
+        const unofficialConfigs = ['enableShareAppMessage', 'enableShareTimeline', 'enablePageMeta', 'components'];
         unofficialConfigs.forEach(item => {
             delete config[item];
         });
@@ -1144,7 +1166,7 @@ class TaroMiniPlugin {
         const { RawSource } = compiler.webpack.sources;
         let templStr = templateFn(...options);
         const fileTemplName = this.getTemplatePath(this.getComponentName(filePath));
-        if ((_a = this.options.minifyXML) === null || _a === void 0 ? void 0 : _a.collapseWhitespace) {
+        if ((_a = this.options.combination.config.minifyXML) === null || _a === void 0 ? void 0 : _a.collapseWhitespace) {
             const minify = require('html-minifier').minify;
             templStr = minify(templStr, {
                 collapseWhitespace: true,
@@ -1153,7 +1175,7 @@ class TaroMiniPlugin {
         }
         compilation.assets[fileTemplName] = new RawSource(templStr);
     }
-    generateXSFile(compilation, compiler, xsPath, isBuildPlugin) {
+    generateXSFile(compilation, compiler, xsPath) {
         const { RawSource } = compiler.webpack.sources;
         const ext = this.options.fileType.xs;
         const isSupportXS = this.options.template.supportXS;
@@ -1162,7 +1184,7 @@ class TaroMiniPlugin {
         }
         const xs = this.options.template.buildXScript();
         const fileXsName = this.getTargetFilePath(xsPath, ext);
-        const filePath = this.getIsBuildPluginPath(fileXsName, isBuildPlugin);
+        const filePath = fileXsName;
         compilation.assets[filePath] = new RawSource(xs);
     }
     getComponentName(componentPath) {
@@ -1173,12 +1195,12 @@ class TaroMiniPlugin {
         }
         else {
             componentName = componentPath.replace(this.options.sourceDir, '').replace(/\\/g, '/').replace(path_1.default.extname(componentPath), '');
+            if (this.options.isBuildPlugin) {
+                componentName = componentName.replace(/plugin\//, '');
+            }
         }
         return componentName.replace(/^(\/|\\)/, '');
     }
-    getIsBuildPluginPath(filePath, isBuildPlugin) {
-        return isBuildPlugin ? `plugin/${filePath}` : filePath;
-    }
     /**
      * 根据 app、页面、组件的路径获取对应的 config 配置文件的路径
      * @returns config 的路径
@@ -1247,10 +1269,10 @@ class TaroMiniPlugin {
         this.independentPackages.forEach((_, name) => { independentPackageNames.push(name); });
         Object.keys(assets).forEach(assetName => {
             const fileName = path_1.default.basename(assetName, path_1.default.extname(assetName));
-            if ((helper_1.REG_STYLE.test(assetName) || REG_STYLE_EXT.test(assetName))
-                && this.options.commonChunks.includes(fileName)
+            if ((helper_1.REG_STYLE.test(assetName) || REG_STYLE_EXT.test(assetName)) &&
+                this.options.commonChunks.includes(fileName) &&
                 // app.wxss 不能引入独立分包中的 common 样式文件
-                && independentPackageNames.every(name => !assetName.includes(name))) {
+                independentPackageNames.every(name => !assetName.includes(name))) {
                 commons.add('\n');
                 commons.add(`@import ${JSON.stringify((0, loader_utils_1.urlToRequest)(assetName))};`);
                 componentCommons.push(assetName);
@@ -1278,7 +1300,7 @@ class TaroMiniPlugin {
                         const source = new ConcatSource('');
                         const originSource = assets[pageStyle];
                         componentCommons.forEach(item => {
-                            source.add(`@import ${JSON.stringify((0, loader_utils_1.urlToRequest)(path_1.default.relative(path_1.default.dirname(pageStyle), item)))};\n`);
+                            source.add(`@import ${JSON.stringify((0, loader_utils_1.urlToRequest)(path_1.default.posix.relative(path_1.default.dirname(pageStyle), item)))};\n`);
                         });
                         source.add(originSource);
                         assets[pageStyle] = source;
@@ -1287,7 +1309,7 @@ class TaroMiniPlugin {
                         if (pageStyle in assets) {
                             const source = new ConcatSource('');
                             const originSource = assets[pageStyle];
-                            source.add(`@import ${JSON.stringify((0, loader_utils_1.urlToRequest)(path_1.default.relative(path_1.default.dirname(pageStyle), 'app.wxss')))};\n`);
+                            source.add(`@import ${JSON.stringify((0, loader_utils_1.urlToRequest)(path_1.default.posix.relative(path_1.default.dirname(pageStyle), 'app' + styleExt)))};\n`);
                             source.add(originSource);
                             assets[pageStyle] = source;
                         }