search

react-microfrontends / people

The microfrontend for People in the star wars universe
MIT License
22 stars 29 forks source link

Import @react-mf/api #1

Closed gonzispina closed 4 years ago

gonzispina commented 4 years ago

I don't understand how are you compiling the application. You are importing @react-mf/api but it is not declared anywhere. I'm having some problems compiling my application.

frehner commented 4 years ago

Anything starting with @react-mf means it's a module that's resolved at runtime, in the browser and not during compile time. See https://single-spa.js.org/docs/recommended-setup#import-maps

gonzispina commented 4 years ago

OK cool, but I've been looking at the webpack config of the planet's and people's repo and there's nothing that let the compiler know that the api module should be imported at runtime. I dunno what I'm missing

frehner commented 4 years ago

They’re not connected at compile time, so there’s nothing for the compiler to know about. Everything happens at runtime

A comparison would be: do native ES modules know about each other at compile time? No. They just export things that other modules can import.

wenisy commented 4 years ago

I saw you import people, navbar, planets, styleguid, root-config here https://github.com/react-microfrontends/root-config/blob/master/src/index.ejs

but when and where you import api ? I know it happened at runtime, but at least it should imported api ? dont know what I'm missing. @frehner

wenisy commented 4 years ago

OK cool, but I've been looking at the webpack config of the planet's and people's repo and there's nothing that let the compiler know that the api module should be imported at runtime. I dunno what I'm missing

Hi there, do you understand what happened? @gonzispina

wenisy commented 4 years ago

https://github.com/react-microfrontends/root-config/blob/master/src/index.ejs#L9

find the reason here.

joeldenning commented 4 years ago

@react-mf/api is an "in-browser module." Import maps determine the URL that the browser uses to download the module from. Webpack externals instruct webpack to omit @react-mf/api from the bundle so that it can be provided as an in-browser module.

Here are documentation links, which include links to tutorial videos: