webpack-5 | webpack for neogcamp | Build Tool library

Working on Webpack 5 and Storybook integration in our React apps' repository. Mainly upgrading from Webpack v4 to v5 because its support has been announced here in this blog post officially. Following the suggested full instructions.

With the below mentioned setup I get the following error message on the console:

I am trying to add experiments to the webpack config but am unable to determine what I am doing wrong.

my environment:

• yarn@1.22.5
• node@12.13.0

I created a brand new next app with npx create-next-app blog

Based on what I have read I need to add a resolutions property to the package.json like so:

I consider to create microfrontend with Webpack 5 Module Federation as described on https://indepth.dev/posts/1173/webpack-5-module-federation-a-game-changer-in-javascript-architecture.

Has anyone experience with Webpack 5 Module Federation? If yes, could you please share your experience?

Can I use it with Create a New React App tool? When I create an app with Create a New React App, I can not see any webpack.config.js file.

I am building a React application based on micro-frondends using ModuleFederationPlugin ModuleFederationPlugin from webpack 5.

I have two separated projects (App1 and App2) which expose components and these are used in other project (AppShell).

App1 structure:

I was looking into Webpack 5 Module federation feature, and have some trouble understanding why my code does not work. The idea is pretty similar to what standard module federation examples do:

app1 - is the host app app2 - is a remote exposing the whole app to app1

(app1 renders the header and horizontal line, below which the app2 should be rendered)

Both app1 and app2 declares react and react-dom as their shared, singleton, eager dependencies in the weback.config.js:

I installed React with tailwind from this: https://github.com/altafino/react-webpack-5-tailwind-2

I want to make a bg color like above in the picture. But I get no background-color its white. But Why?

this picture above is from tailwind.com first or second content

As announced in Webpacks 5.0 release blog post build still works in most browsers after a few minor adjustments in webpack.config.js.

But it stopped working in Internet Explorer (11) because the generated output is mixed ES6 and ES5 and therefore incompatible with IE (see image).

As it actually leads to no successful build using a variety of babel plugins I'm asking myself if theres an "easy" way to specify ES5 as the generated output.

From beta phase of webpack-5 I found a flag on Medium which seems not working anymore.