Closed simonpeters closed 1 year ago
I think this is due to the configuration being updated for 15.9. Previously withNx
returned the configuration object, but now it returns a function. This is fine if you just exported with module.exports = withNx(config)
, but if you add other Next.js plugins you will need to do it like this:
// next.config.js
// ...
/**
* @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}
**/
const nextConfig = {
// ...
};
const plugins = [
// Your plugins exlcuding withNx
];
module.exports = async (phase, context) => {
let updatedConfig = plugins.reduce((acc, fn) => fn(acc), nextConfig);
// Apply the async function that `withNx` returns.
updatedConfig = await withNx(updatedConfig)(phase, context);
// If you have plugins that has to be added after Nx you can do that here.
// For example, Sentry needs to be added last.
updatedConfig = require('@sentry/nextjs')(updatedConfig, { silent: true });
return updatedConfig;
};
See here for more details:
https://nx.dev/packages/next/documents/next-config-setup#manually-composing-plugins-(nx-15-and-prior)
For Nx 16, we are providing a composePlugins
function that will allow the composition to be done correctly.
Closing this issue as it should be addressed. If my assumption is not correct, please re-open and provide a reproduction repo to demonstrate what is broken and we'll take a closer look.
hi @jaysoo , this doesn't seem to be the case with me.
This is what my next.config.js
looks like.
//@ts-check
// eslint-disable-next-line @typescript-eslint/no-var-requires
const { withNx } = require('@nrwl/next/plugins/with-nx');
/**
* @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}
**/
const nextConfig = {
nx: {
// Set this to true if you would like to to use SVGR
// See: https://github.com/gregberge/svgr
svgr: false,
},
};
module.exports = withNx(nextConfig);
Its the default next.config.js
I will try and create a reproduction repo when I have a bit of time.
@jaysoo I made a repo
https://github.com/simonpeters/nx-bug-repo
when running https://github.com/simonpeters/nx-bug-repo
I get the following error.
> nx run ronnie:serve:development
error - ../ui/src/icons/FacebookIcon.tsx
Module parse failed: Unexpected token (3:34)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| import { Icon, IconProps } from "@chakra-ui/react";
|
> export const FacebookIcon = (props: IconProps) => (
| <Icon viewBox='0 0 27 26' {...props}>
| <path d="M26.475 13.0886C26.475 5.98911 20.7198 0.233873 13.6203 0.233873C6.52086 0.233873 0.765625 5.98911 0.765625 13.0886C0.765625 19.5047 5.4664 24.8228 11.6118 25.7871V16.8044H8.34789V13.0886H11.6118V10.2565C11.6118 7.03481 13.5309 5.25524 16.4672 5.25524C17.8736 5.25524 19.3447 5.50631 19.3447 5.50631V8.66977H17.7237C16.1269 8.66977 15.6289 9.66066 15.6289 10.6772V13.0886H19.194L18.6241 16.8044H15.6289V25.7871C21.7742 24.8228 26.475 19.5047 26.475 13.0886Z" fill="currentColor"/>
Import trace for requested module:
../ui/src/icons/FacebookIcon.tsx
../ui/src/icons/index.tsx
../ui/src/index.ts
[ ready ] on http://localhost:4200
I don't think I can re-open the issue myself.
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.
Current Behavior
when running nx serve or nx build on any project that relies on a nx lib package I get the same error.
Expected Behavior
for the build or serve to work
GitHub Repo
No response
Steps to Reproduce
I have no idea what of my project is causing this issue so its hard to reproduce.
If created new a nx lib and a new nx next project and pasted my old in it to see if it was any boilerplate code but I still have same issues. The issue came up after updating nx but I cannot seem to revert it anymore.
my package.json
Nx Report
Failure Logs
No response
Additional Information
No response