rsnext/test/e2e/app-dir/emotion-js/next.config.js

/** @type {import("next").NextConfig} */
module.exports = {
  reactStrictMode: true,
  compiler: {
    emotion: true,
  },
}
Fix emotion-js transform for server components (#54284) ### What & Why emotion-js has its own [jsx transform](https://emotion.sh/docs/typescript#emotionreact) which is being applied when `compiler.emotion` is enabled in `next.config.js`. Thanks to emotion-js team that provided an emotion-js example setup with app router [here](https://github.com/emotion-js/emotion/issues/2928#issuecomment-1319792703), so that we can use it as test example with app router. Based on the setup, we create a test case working with emotion js but failed with error mentioned in #41994 that some client hooks appearing in server components. That is because the emotion-js jsx factory includes some client hooks. ### How For server components, css-in-js is not recommended to apply so we disabled the transform before, the emotion jsx factory is a separate config that should also not be applied in server components. So in this case we still use react jsx factory instead of the emotion-js one for server components then it won't error. The test case can also be used as an example for basic emotion-js use case with app router. Fixes #41994 Closes NEXT-1368 2023-08-20 05:14:16 +02:00			`/** @type {import("next").NextConfig} */`
			`module.exports = {`
			`reactStrictMode: true,`
			`compiler: {`
			`emotion: true,`
			`},`
			`}`