Git Product home page Git Product logo

Comments (13)

jeremy-ww avatar jeremy-ww commented on May 12, 2024 1
{
  libraryTarget: 'umd',
  library: packageName,
  jsonpFunction: `webpackJsonp_${packageName}`
}

确保 webpack 有以上三个配置

jsonpFunction在webpack5中不存在这个配置 会有问题吗? @kuitos

webpack5 是自动生成的,https://webpack.js.org/blog/2020-10-10-webpack-5-release/#automatic-unique-naming

from qiankun.

kuitos avatar kuitos commented on May 12, 2024

output libraryTarget 设置成 umd
https://webpack.js.org/configuration/output/#outputlibrarytarget

from qiankun.

jiachaosun avatar jiachaosun commented on May 12, 2024

@kuitos
谢谢回复,我在output中加入了libraryTarget: "umd" ,然后用devServer方式启动,可是在main项目里点击后还是报相同的错误。

sub-app webpack config:

  output: {
    path: path.join(__dirname, "..", "dist"),
    chunkFilename: "[name].js",
    filename: "[name].js",
    publicPath: "",
    libraryTarget: "umd"
  },

sub-app index.js 也很简单

import React from "react";
import ReactDOM from "react-dom";

const App = () => <div>app</div>;

export async function bootstrap() {
  console.log("give web bootstraped");
}

export async function mount(props) {
  console.log("props from main framework", props);
  ReactDOM.render(<App />, document.getElementById("root"));
}

export async function unmount() {
  ReactDOM.unmountComponentAtNode(document.getElementById("root"));
}

错误信息:

index.js:56 Uncaught xxx web: Application 'xxx web' died in status LOADING_SOURCE_CODE: You need to export the functional lifecycles in xxx web entry

from qiankun.

zeihang avatar zeihang commented on May 12, 2024

我是这么配置的

output: {
        filename: 'bundle.js',
        path: path.join(__dirname, './dist'),
        publicPath: '/',
        library: 'reactTs',
        libraryTarget: 'umd',
        umdNamedDefine: true
},

现在项目运行正常 @jiachaosun

from qiankun.

zeihang avatar zeihang commented on May 12, 2024

是因为我用typescript的缘故吗,我跑普通react项目还是会报错

from qiankun.

jiachaosun avatar jiachaosun commented on May 12, 2024

@zeihang
我用了你的配置后,确实跑成功了。不过只能是子项目每次yarn start后的第一次,一旦hot reload触发一次后容器项目就还是上面那种报错。

PS:回复内容时,你可以使用md格式贴代码哦,这样看起来舒服。

from qiankun.

kuitos avatar kuitos commented on May 12, 2024
{
  libraryTarget: 'umd',
  library: packageName,
  jsonpFunction: `webpackJsonp_${packageName}`
}

确保 webpack 有以上三个配置

from qiankun.

kuitos avatar kuitos commented on May 12, 2024

updated README, see https://github.com/umijs/qiankun#webpack

from qiankun.

jiachaosun avatar jiachaosun commented on May 12, 2024

thx,@kuitos
现在已经运行成功,我的sub app非常复杂是一个50个页面app的web版。但是sub app一旦hot reload一次后,就还是会报这个错,无论是修改css还是js

index.js:56 Uncaught xxx web: Application 'xxx web' died in status LOADING_SOURCE_CODE: You need to export the functional lifecycles in xxx web entry

我猜测应该还是打包或者导出的问题,是否会和code split的格式有关系

from qiankun.

zeihang avatar zeihang commented on May 12, 2024

@
跳子项目路由时没问题吗,我一跳转就会进入空白页面,热更新就没生效过

from qiankun.

jiachaosun avatar jiachaosun commented on May 12, 2024

@
跳子项目路由时没问题吗,我一跳转就会进入空白页面,热更新就没生效过

子项目路由跳转没问题,空白的问题应该是你子项目路由router没加basename吧

from qiankun.

guojingwen avatar guojingwen commented on May 12, 2024

@kuitos 使用webpack构建,开发没有问题,打包后 子项目js 加载正常但不会运行,也没有报错,

from qiankun.

Measy avatar Measy commented on May 12, 2024
{
  libraryTarget: 'umd',
  library: packageName,
  jsonpFunction: `webpackJsonp_${packageName}`
}

确保 webpack 有以上三个配置

jsonpFunction在webpack5中不存在这个配置 会有问题吗? @kuitos

from qiankun.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.