question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

withNx and next-translate results in duplicate export of '__N_SSG' when using getStaticProps

See original GitHub issue

Current Behavior

When using getStaticProps on a non-dynamic page (e.g. index.tsx) while using next-translate with withNx it results in the following error:

Module parse failed: Duplicate export '__N_SSG' (8:11)
File was processed with these loaders:
 * ../../node_modules/@next/react-refresh-utils/loader.js
 * ../../node_modules/next/dist/build/babel/loader/index.js
 * ../../node_modules/next-translate/lib/cjs/plugin/loader.js
 * ../../node_modules/@next/react-refresh-utils/loader.js
 * ../../node_modules/next/dist/build/babel/loader/index.js
You may need an additional loader to handle the result of these loaders.
| import styles from './index.module.css';
| export var __N_SSG = true;
> export var __N_SSG = true;
| export function Index() {
|   /*

and does not load the page, or any the entire app for that matter, at all.

Funnily enough it works fine with a dynamic page, e.g. [slug].tsx.

Expected Behavior

It should be completely fine to use getStaticProps while using next-translate in a Nx monorepo.

Steps to Reproduce

I created a minimal GitHub repo where you can reproduce this error: https://github.com/amosbastian/nrwl-repro. I followed https://nx.dev/latest/react/guides/nextjs and simply added next-translate and getStaticProps to index.tsx.

Failure Logs

As shown above:

error - ./pages/index.tsx
Module parse failed: Duplicate export '__N_SSG' (8:11)
File was processed with these loaders:
 * ../../node_modules/@next/react-refresh-utils/loader.js
 * ../../node_modules/next/dist/build/babel/loader/index.js
 * ../../node_modules/next-translate/lib/cjs/plugin/loader.js
 * ../../node_modules/@next/react-refresh-utils/loader.js
 * ../../node_modules/next/dist/build/babel/loader/index.js
You may need an additional loader to handle the result of these loaders.
| import styles from './index.module.css';
| export var __N_SSG = true;
> export var __N_SSG = true;
| export function Index() {
|   /*
getStaticProps
next-translate - compiled page: / - locale: en - namespaces: common - used loader: getStaticProps
Could not find files for / in .next/build-manifest.json
Could not find files for / in .next/build-manifest.json

Environment

Node : 14.16.1
OS   : darwin x64
npm  : 7.20.5

I also created an issue in the nrwl/nx repository since I wasn’t sure which is causing the error.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:15 (9 by maintainers)

github_iconTop GitHub Comments

2reactions
aralrocacommented, Sep 17, 2021

@shelooks16 @amosbastian I’ve made a fix in the 1.1.0-canary.4, I hope that with this version it will work. At least @amosbastian with your repo works fine with this version (I have tried to create several pages and several languages too and everything seems to work fine).

1reaction
quyphan97commented, Sep 19, 2021

@aralroca sorry. but also thank you

Read more comments on GitHub >

github_iconTop Results From Across the Web

withNx and next-translate results in duplicate export of ' ...
When using getStaticProps on a non-dynamic page (e.g. index.tsx ) while using next-translate it results in the following error:.
Read more >
Data Fetching: getStaticProps
Fetch data and generate static pages with `getStaticProps`. ... If you export a function called getStaticProps (Static Site Generation) from a page, Next.js ......
Read more >
How to pass getStaticProps result to Leaflet Canvas Layer ...
Try changing your getStaticProps to something like this. You can then use mapPoints or whatever you want to call it export async function ......
Read more >
GetStaticProps vs GetServerSideProps: Next JS Data ...
The advantage of using GetStaticProps is that it lets the page be statically generated. As a result, out of all the available data...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found