You may need an additional loader to handle the result of these loaders.

[burakkgunduzz]

What version of this package are you using? "next-translate-plugin": "^2.0.2"

What operating system, Node.js, and npm version? v18.15.0

What happened? after I upgraded next-translate and added next-translate-plugin my builds started to fail. Everything works correctly in development server but I am not able to build my app. I am using nx monorepo and all the stack trace and errors points to my lib folders interestingly. Everything was working before with next v12.1.5 and next-translate v1.4.0

What did you expect to happen? It should of work.

Are you willing to submit a pull request to fix this bug? No

---

**Stack Trace

File was processed with these loaders:
 * ../../node_modules/next-translate-plugin/lib/cjs/loader.js
You may need an additional loader to handle the result of these loaders.
| 
|   return (
>     <div className={cx([styles.embla, options.wrapperClass])}>
|       <div className={styles.embla__viewport} ref={viewportRef}>
|         <div className={styles.embla__container}>

Import trace for requested module:
../../libs/core/components/web/ImageSlider/index.js
../../libs/core/components/web/index.js

---

if I downgrade next version to 13.1.1 (from v13.2.4)then I get the below error

info  - Collecting page data .Error: You can not use getInitialProps with getStaticProps. To use SSG, please remove your getInitialProps
    at /Users/burakgunduz/Documents/development/work/fg-client/node_modules/next/dist/build/utils.js:913:19
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Span.traceAsyncFn (/Users/burakgunduz/Documents/development/work/fg-client/node_modules/next/dist/trace/trace.js:79:20)
info  - Collecting page data .
 >  NX   Failed to collect page data for /_error```

[aralroca]

Thanks to report it @burakkgunduzz, would you create a reproducible repo about this issue to take a look what is happening? Thanks a lot!

[burakkgunduzz]

Hey @aralroca thanks for your attention! I will try to create in a day or two hopefully.

[burakkgunduzz]

Hi @aralroca, I reproduced the error. You can clone this repo => https://github.com/burakkgunduzz/next-translate-with-libs if I module.exports = withNx(nextTranslate(nextConfig)); in next.config.js then both nx serve (development server) nx run build works correctly. However, if module.exports = nextTranslate(withNx(nextConfig)); serve and build fails with the error below. (Which is understandable, the order matters in next.config.js exports)

Failed to compile.

../../libs/burak/src/lib/burak.js
Module parse failed: Unexpected token (4:4)
File was processed with these loaders:
 * ../../node_modules/next-translate-plugin/lib/cjs/loader.js
You may need an additional loader to handle the result of these loaders.
| export function Burak(props) {
|   return (
>     <div className={styles['container']}>
|       <h1>Welcome to Burak!</h1>
|     </div>

Import trace for requested module:
../../libs/burak/src/lib/burak.js
../../libs/burak/src/index.js

On the other hand, I was not able to fix my problem in my original repo by swicthing the position of nextTranslate in next.config. It runs development server but still throws error when try to build. I am sharing my next.config.js below.

const nextTranslate = require('next-translate-plugin')
const { withSentryConfig } = require('@sentry/nextjs')
const withNx = require('@nrwl/next/plugins/with-nx')
const withPWA = require('next-pwa')({
  dest: process.env.VERCEL_ENV ? '../../public' : 'public',
  disable: process.env.NODE_ENV === 'development',
  register: true,
  skipWaiting: true
})

const localeSubpaths = {}

const nextConfig = nextTranslate(
  withPWA({
    webpack: (config, options) => {
      return config
    },
    sentry: {
      hideSourceMaps: true
    },
    publicRuntimeConfig: {
      localeSubpaths
    },
    images: {
      domains: [
        'example.com'
      ]
    },
    nx: {
      svgr: false
    }
  })
)

const sentryWebpackPluginOptions = {
  silent: process.env.VERCEL_ENV ? false : true,
  dryRun: process.env.VERCEL_ENV ? false : true,
  include: './dist/apps/example/.next'
}

module.exports = withSentryConfig(withNx(nextConfig), sentryWebpackPluginOptions)

[burakkgunduzz]

PS: when I remove imports from lib in my example repo, everything works correctly again. Wondering, if it is related with libs and monorepo structure? Further investigating.

[burakkgunduzz]

Seems like a breaking change in next.js and it affected nx. I am giving some links for further info. Please take a look and close this issue if you are sure that this bug is not related with next-translate-plugin. @aralroca => https://github.com/vercel/next.js/issues/46374#issuecomment-1476717052 => https://github.com/nrwl/nx/issues/15214

[burakkgunduzz]

I was able to successfully build my apps after upgrading to latest nx version and exporting my next.config as

module.exports = async (phase) => {
  let updatedConfig = plugins.reduce((acc, fn) => fn(acc), nextConfig);
  updatedConfig = await withNx(updatedConfig)(phase);
  updatedConfig = withSentryConfig(updatedConfig, sentryWebpackPluginOptions);
  return updatedConfig;
}

for further info https://github.com/nrwl/nx/issues/15794 Also, I am closing this issue since this is not a problem related to next-translate-plugin