next-transpile-modules: TypeError: Cannot set property 'styles' of undefined

  • I HAVE READ THE FAQ AND MY PROBLEM WAS NOT DESCRIBED THERE
  • I WILL GIVE 10$ TO CHARITY IF MY SOLUTION WAS ACTUALLY IN THE README/FAQ

Are you trying to transpile a local package or an npm package? https://www.npmjs.com/package/@adobe/react-spectrum

Describe the bug Not sure what styles are undefined. I actually updated my single page to say import mystyles but I am still getting a message that TypeError: Cannot set property 'styles' of undefined.

To Reproduce I have config like this:

const withPlugins = require("next-compose-plugins");
const withCSS = require("@zeit/next-css");
const withTM = require("next-transpile-modules")(["@adobe/react-spectrum"]);

module.exports = withPlugins([withCSS, withTM], {
  reactStrictMode: true,
});

I run npm run dev and the ONLY page I have is this:

import mystyles from "../../styles/index.module.scss";
export default function Index() {

My _app.js has these imports:

import { SSRProvider, Provider, defaultTheme } from "@adobe/react-spectrum";
import "../../styles/globals.scss";
import type { AppProps } from "next/app";

Expected behavior For things to compile

Setup

  • Next.js version: 11.0.1
  • next-transpile-modules version: 8.0.0
  • Node.js version: 14.17.0
  • npm/yarn version: npm 6.14.13
  • Operating System: OSX Catalina
  • Webpack 4 or 5: 5
TypeError: Cannot set property 'styles' of undefined
    at module.exports (/path/to/repo/node_modules/@zeit/next-css/css-loader-config.js:25:56)
    at Object.webpack (/path/to/repo/node_modules/@zeit/next-css/index.js:15:36)
    at Object.webpack (/path/to/repo/node_modules/next-transpile-modules/src/next-transpile-modules.js:352:29)
    at getBaseWebpackConfig (/path/to/repo/node_modules/next/dist/build/webpack-config.js:162:454)
    at async Promise.all (index 0)
    at async HotReloader.start (/path/to/repo/node_modules/next/dist/server/hot-reloader.js:16:133)
    at async DevServer.prepare (/path/to/repo/node_modules/next/dist/server/next-dev-server.js:16:453)
    at async /path/to/repo/node_modules/next/dist/cli/next-dev.js:22:1

Additional context

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 18 (4 by maintainers)

Most upvoted comments

Ohhh @fabianishere cool! I copy pasted your list (didn’t realize you had done it this specific way) and it works image