Vue は Google 48 と互換性があります (qiankun との互換性を含む)

コンソールは、対応するプラグインの js を見つけて、プラグインを見つけます。

1. vue.config.js で設定します。

'transpileDependencies': ['@jiaminghi/*',],

transpileDependency は、特に es6 コードを es5 に変換する必要があるプラグインの説明です。

2. css3 の var には互換性があります。

npm install css-vars-ponyfill mutationobserver-shim —save

import 'mutationobserver-shim'
import cssVars from 'css-vars-ponyfill'
cssVars({
watch: true
})

3. Qiankun は、main.js で設定された古いバージョンの Google と互換性があります: (注: サブアプリケーションは babel-polyfill を使用できません)

npm install whatwg-fetchcustom-event-polyfill core-js

import 'whatwg-fetch';

import 'custom-event-polyfill';

import 'core-js/stable/promise';

import 'core-js/stable/symbol';

import 'core-js/stable/string/starts-with';

import 'core-js/web/url';

4. qiankun は Google バージョン 48 と互換性があり、「

Application died in status LOADING_SOURCE_CODE: You need to export the functional lifecycles in xxx entry

」

解決策: output.library メイン アプリケーションに登録されている name フィールドと一致するように webpack を構成します。たとえば、次のとおりです。

// 主应用中注册子应用
registerMicroApps([
  {
    name: 'brokenSubApp',
    entry: '//localhost:7100',
    container: '#yourContainer',
    activeRule: '/react',
  },
]);
//将微应用的 output.library 改为跟主应用中注册的一致：
module.exports = {
  output: {
    // 这里改成跟主应用中注册的一致
    library: 'brokenSubApp',
    libraryTarget: 'umd',
    jsonpFunction: `webpackJsonp_${packageName}`,
  },
};