Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Wrong webpack config for react app with module federation #14344

Closed
vadimka123 opened this issue Jan 13, 2023 · 6 comments · Fixed by #14447
Closed

Wrong webpack config for react app with module federation #14344

vadimka123 opened this issue Jan 13, 2023 · 6 comments · Fixed by #14447
Labels
outdated scope: react Issues related to React support for Nx type: bug

Comments

@vadimka123
Copy link
Contributor

vadimka123 commented Jan 13, 2023

Current Behavior

Checked on empty just now created project

  1. Typo in template

NX Unexpected token ')'
/Users/vadimgoy/workspace/test/apps/cart/webpack.config.js:3
const { withModuleFederation } = require('@nrwl/react/module-federation'));
^

SyntaxError: Unexpected token ')'
    at Object.compileFunction (node:vm:360:18)
    at wrapSafe (node:internal/modules/cjs/loader:1088:15)
    at Module._compile (node:internal/modules/cjs/loader:1123:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1213:10)
    at Module.load (node:internal/modules/cjs/loader:1037:32)
    at Module._load (node:internal/modules/cjs/loader:878:12)
    at Module.require (node:internal/modules/cjs/loader:1061:19)
    at require (node:internal/modules/cjs/helpers:103:18)
    at resolveCustomWebpackConfig (/Users/vadimgoy/workspace/test/node_modules/@nrwl/webpack/src/utils/webpack/custom-webpack.js:28:33)
    at /Users/vadimgoy/workspace/test/node_modules/@nrwl/webpack/src/executors/webpack/webpack.impl.js:30:77
  1. After fixing I get next error looks like due to withModuleFederation return Promise instead of function
 >  NX   plugin is not a function
TypeError: plugin is not a function
    at combined (/Users/vadimgoy/workspace/test/node_modules/@nrwl/webpack/src/utils/config.js:16:22)
    at /Users/vadimgoy/workspace/test/node_modules/@nrwl/webpack/src/executors/webpack/webpack.impl.js:37:26
    at Generator.next (<anonymous>)
    at /Users/vadimgoy/workspace/test/node_modules/tslib/tslib.js:118:75
    at new Promise (<anonymous>)
    at Object.__awaiter (/Users/vadimgoy/workspace/test/node_modules/tslib/tslib.js:114:16)
    at getWebpackConfigs (/Users/vadimgoy/workspace/test/node_modules/@nrwl/webpack/src/executors/webpack/webpack.impl.js:20:20)
    at webpackExecutor_1 (/Users/vadimgoy/workspace/test/node_modules/@nrwl/webpack/src/executors/webpack/webpack.impl.js:82:47)
    at webpackExecutor_1.next (<anonymous>)
    at resume (/Users/vadimgoy/workspace/test/node_modules/tslib/tslib.js:230:48)
  1. Also I get warning - Could not find a version for "@nrwl/webpack" in the root "package.json" when collecting shared packages for the Module Federation setup. The package will not be shared.

Expected Behavior

All running successfully and without any warnings in just now created project

Github Repo

No response

Steps to Reproduce

  1. npx create-nx-workspace@latest
  2. npx nx g @nrwl/react:host host --remotes=cart,blog,shop
  3. nx serve host --verbose

Nx Report

Node : 18.12.1
   OS   : darwin x64
   npm  : 8.19.2
   
   nx : 15.5.0
   @nrwl/angular : Not Found
   @nrwl/cypress : 15.5.0
   @nrwl/detox : Not Found
   @nrwl/devkit : 15.5.0
   @nrwl/esbuild : Not Found
   @nrwl/eslint-plugin-nx : 15.5.0
   @nrwl/expo : Not Found
   @nrwl/express : Not Found
   @nrwl/jest : 15.5.0
   @nrwl/js : 15.5.0
   @nrwl/linter : 15.5.0
   @nrwl/nest : Not Found
   @nrwl/next : Not Found
   @nrwl/node : Not Found
   @nrwl/nx-cloud : Not Found
   @nrwl/nx-plugin : Not Found
   @nrwl/react : 15.5.0
   @nrwl/react-native : Not Found
   @nrwl/rollup : 15.5.0
   @nrwl/schematics : Not Found
   @nrwl/storybook : Not Found
   @nrwl/web : 15.5.0
   @nrwl/webpack : 15.5.0
   @nrwl/workspace : 15.5.0
   @nrwl/vite : 15.5.0
   typescript : 4.8.4
   ---------------------------------------
   Local workspace plugins:
   ---------------------------------------
   Community plugins:

Failure Logs

No response

Additional Information

No response

@scottn-logic2020
Copy link

Issue began in 15.4.6. Attaching logs of creating a workspace in 15.4.5 and 15.4.6 on a cloned VM using the same script with version number being the only difference for reference
nx@15.4.6-qs-log-2301151538PST.log
nx@15.4.5-qs-log-2301151605PST.log

@Ktoxcon
Copy link
Contributor

Ktoxcon commented Jan 18, 2023

@vadimka123 moving to 15.4.4 works for me now, this issue still needs more research tough.

@mahidhar4
Copy link

mahidhar4 commented Jan 23, 2023

This is issue is still there In latest version 15.5.3

2 & 3 points are stil exists

@Ktoxcon
Copy link
Contributor

Ktoxcon commented Jan 23, 2023

@mahidhar4 Please check the releases page.
15.5.3 doesn't include these changes.

@vadimka123
Copy link
Contributor Author

I still unable to run just created project
Same steps to reproduce, version 15.6.2

ERROR in container entry ./Module[0] Module not found: Error: Can't resolve './src/remote-entry.ts' in '/Users/vadimgoy/workspace/test' resolve './src/remote-entry.ts' in '/Users/vadimgoy/workspace/test' using description file: /Users/vadimgoy/workspace/test/package.json (relative path: .) Field 'browser' doesn't contain a valid alias configuration using description file: /Users/vadimgoy/workspace/test/package.json (relative path: ./src/remote-entry.ts) no extension Field 'browser' doesn't contain a valid alias configuration /Users/vadimgoy/workspace/test/src/remote-entry.ts doesn't exist .ts Field 'browser' doesn't contain a valid alias configuration /Users/vadimgoy/workspace/test/src/remote-entry.ts.ts doesn't exist .tsx Field 'browser' doesn't contain a valid alias configuration /Users/vadimgoy/workspace/test/src/remote-entry.ts.tsx doesn't exist .mjs Field 'browser' doesn't contain a valid alias configuration /Users/vadimgoy/workspace/test/src/remote-entry.ts.mjs doesn't exist .js Field 'browser' doesn't contain a valid alias configuration /Users/vadimgoy/workspace/test/src/remote-entry.ts.js doesn't exist .jsx Field 'browser' doesn't contain a valid alias configuration /Users/vadimgoy/workspace/test/src/remote-entry.ts.jsx doesn't exist as directory /Users/vadimgoy/workspace/test/src/remote-entry.ts doesn't exist webpack 5.75.0 compiled with 1 error in 2633 ms

@github-actions
Copy link

github-actions bot commented Mar 3, 2023

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Mar 3, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
outdated scope: react Issues related to React support for Nx type: bug
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants