Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Latest version error @ NextJS 14.2.4 #65

Open
nkke30 opened this issue Jun 23, 2024 · 9 comments
Open

Latest version error @ NextJS 14.2.4 #65

nkke30 opened this issue Jun 23, 2024 · 9 comments

Comments

@nkke30
Copy link

nkke30 commented Jun 23, 2024

I started getting this error on build:

unhandledRejection CssSyntaxError: /home/source/next/app/globals.css:1:1: Unknown word
    at Input.error (/home/source/next/node_modules/postcss/lib/input.js:106:16)
    at Parser.unknownWord (/home/source/next/node_modules/postcss/lib/parser.js:593:22)
    at Parser.other (/home/source/next/node_modules/postcss/lib/parser.js:435:12)
    at Parser.parse (/home/source/next/node_modules/postcss/lib/parser.js:470:16)
    at parse (/home/source/next/node_modules/postcss/lib/parse.js:11:12)
    at LazyResult (/home/source/next/node_modules/postcss/lib/lazy-result.js:133:16)
    at Processor.process (/home/source/next/node_modules/postcss/lib/processor.js:53:14)
    at cssHandler (file:///home/source/next/node_modules/@tailwindcss-mangle/core/dist/index.mjs:247:61)
    at Object.transform (file:///home/source/next/node_modules/unplugin-tailwindcss-mangle/dist/index.mjs:40:24)
    at Object.transform (/home/source/next/node_modules/unplugin/dist/webpack/loaders/transform.js:108:38)
    at LOADER_EXECUTION (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4134)
    at runSyncOrAsync (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4145)
    at iterateNormalLoaders (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5782)
    at iterateNormalLoaders (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5650)
    at /home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5879
    at runSyncOrAsync (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4293)
    at iterateNormalLoaders (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5782)
    at /home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:5142
    at r.callback (/home/source/next/node_modules/next/dist/compiled/loader-runner/LoaderRunner.js:1:4039)
    at handleExports (/home/source/next/node_modules/next/dist/compiled/mini-css-extract-plugin/loader.js:1:6828)
    at /home/source/next/node_modules/next/dist/compiled/mini-css-extract-plugin/loader.js:1:7646
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:821142
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:131690
    at symbolIterator (/home/source/next/node_modules/next/dist/compiled/neo-async/async.js:1:14444)
    at timesSync (/home/source/next/node_modules/next/dist/compiled/neo-async/async.js:1:5027)
    at Object.eachLimit (/home/source/next/node_modules/next/dist/compiled/neo-async/async.js:1:14208)
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:129889
    at symbolIterator (/home/source/next/node_modules/next/dist/compiled/neo-async/async.js:1:14444)
    at done (/home/source/next/node_modules/next/dist/compiled/neo-async/async.js:1:14824)
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:129140
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:109939
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:312825
    at _done (eval at create (/home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:13:28858), <anonymous>:9:1)
    at Hook.eval [as callAsync] (eval at create (/home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:13:28858), <anonymous>:39:22)
    at Cache.store (/home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:16097)
    at ItemCacheFacade.store (/home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:17341)
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:109926
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:15962
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:15523
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:539171
    at /home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:28:15992
    at eval (eval at create (/home/source/next/node_modules/next/dist/compiled/webpack/bundle5.js:13:28858), <anonymous>:30:1)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)
    at runNextTicks (node:internal/process/task_queues:64:3)
    at process.processImmediate (node:internal/timers:449:9) {
  reason: 'Unknown word',
  file: '/home/source/next/app/globals.css',
  source: '// extracted by mini-css-extract-plugin',
  line: 1,
  column: 1,
  endLine: 1,
  endColumn: 3,
  input: {
    column: 1,
    endColumn: 3,
    endLine: 1,
    line: 1,
    source: '// extracted by mini-css-extract-plugin',
    url: 'file:///home/source/next/app/globals.css',
    file: '/home/source/next/app/globals.css'
  }
}
@sonofmagic
Copy link
Owner

Hi nickimbo:
Currently, it appears that version 3.0 only supports Vite.
More frameworks will be supported in the future, and this issue will be continuously tracked.

@sonofmagic
Copy link
Owner

Add nextjs support at [email protected], you could have a try.

@nkke30
Copy link
Author

nkke30 commented Jul 13, 2024

Giving it a try right now.

@nkke30
Copy link
Author

nkke30 commented Jul 13, 2024

Failed to compile.

./app/globals.css
Module not found: Can't resolve 'text-red-800":{"name":"inju-build-339-fh","usedBy":{}},"dark:from-zinc-900":{"name":"inju-build-339-gh","usedBy":{}},"dark:text-blue-500":{"name":"inju-build-339-hh","usedBy":{}},"focus:outline-none":{"name":"inju-build-339-ih","usedBy":{}},"focus:ring-red-500":{"name":"inju-build-339-jh","usedBy":{}},"group-hover:hidden":{"name":"inju-build-339-kh","usedBy":{}},"hover:bg-secondary":{"name":"inju-build-339-lh","usedBy":{}},"hover:text-primary":{"name":"inju-build-339-mh","usedBy":{}},"place-items-center":{"name":"inju-build-339-nh","usedBy":{}},"text-foreground/50":{"name":"inju-build-339-oh","usedBy":{}},"text-foreground/90":{"name":"inju-build-339-ph","usedBy":{}},"transition-opacity":{"name":"inju-build-339-qh","usedBy":{}},"translate-x-[-50%]":{"name":"inju-build-339-rh","usedBy":{}},"translate-y-[-50%]":{"name":"inju-build-339-sh","usedBy":{}},"underline-offset-4":{"name":"inju-build-339-th","usedBy":{}},"'

https://nextjs.org/docs/messages/module-not-found

./app/globals.css
Module not found: Module not found: Error: Can't resolve 'text-red-800":{"name":"inju-build-339-fh","usedBy":{}},"dark:from-zinc-900":{"name":"inju-build-339-gh","usedBy":{}},"dark:text-blue-500":{"name":"inju-build-339-hh","usedBy":{}},"focus:outline-none":{"name":"inju-build-339-ih","usedBy":{}},"focus:ring-red-500":{"name":"inju-build-339-jh","usedBy":{}},"group-hover:hidden":{"name":"inju-build-339-kh","usedBy":{}},"hover:bg-secondary":{"name":"inju-build-339-lh","usedBy":{}},"hover:text-primary":{"name":"inju-build-339-mh","usedBy":{}},"place-items-center":{"name":"inju-build-339-nh","usedBy":{}},"text-foreground/50":{"name":"inju-build-339-oh","usedBy":{}},"text-foreground/90":{"name":"inju-build-339-ph","usedBy":{}},"transition-opacity":{"name":"inju-build-339-qh","usedBy":{}},"translate-x-[-50%]":{"name":"inju-build-339-rh","usedBy":{}},"translate-y-[-50%]":{"name":"inju-build-339-sh","usedBy":{}},"underline-offset-4":{"name":"inju-build-339-th","usedBy":{}},"'

https://nextjs.org/docs/messages/module-not-found


> Build failed because of webpack errors

@sonofmagic
Copy link
Owner

Can you provide me with a reproducible case? I would be very grateful.

@hoangnhan2ka3
Copy link

me too @sonofmagic

The second time I come back with this plugin in nextjs, also not working but different error :D .

Keep it up.

./src/styles/globals.css
Module not found: Can't resolve 'p-[var(--mega-body-padding)]":{"name":"tw-id","usedBy":{}},"[&_[cmdk-group-heading]]:px-2":{"name":"tw-jd","usedBy":{}},"after:transition-[background]":{"name":"tw-kd","usedBy":{}},"before:dark:bg-gradient-to-br":{"name":"tw-ld","usedBy":{}},"before:shadow-mega-primary/40":{"name":"tw-md","usedBy":{}},"before:shadow-mega-primary/80":{"name":"tw-nd","usedBy":{}},"data-[state=closed]:ease-vaul":{"name":"tw-od","usedBy":{}},"data-[state=open]:blur-in-2xl":{"name":"tw-pd","usedBy":{}},"data-[state=open]:zoom-in-125":{"name":"tw-qd","usedBy":{}},"data-align=start:duration-400":{"name":"tw-rd","usedBy":{}},"data-disabled=true:opacity-50":{"name":"tw-sd","usedBy":{}},"data-state=closed:animate-out":{"name":"tw-td","usedBy":{}},"data-state=closed:zoom-out-95":{"name":"tw-ud","usedBy":{}},"hover:after:dark:to-[#0065FF]":{"name":"tw-vd","usedBy":{}},"hover:before:bg-purple-500/20":{"name":"tw-wd","usedBy":{}},"hover:before:bg-yellow-500/20":{"name":"tw-xd","usedBy":{}},"hover:text-mega-secondary/100":{"name":"tw-yd","usedBy":{}},"selection:text-mega-secondary":{"name":"tw-zd","usedBy":{}},"transition-[background-color]":{"name":"tw-ae","usedBy":{}},"after:dark:bg-gradient-to-br":{"name":"tw-be","usedBy":{}},"before:'

https://nextjs.org/docs/messages/module-not-found

./src/styles/globals.css
Module not found: Module not found: Error: Can't resolve 'p-[var(--mega-body-padding)]":{"name":"tw-id","usedBy":{}},"[&_[cmdk-group-heading]]:px-2":{"name":"tw-jd","usedBy":{}},"after:transition-[background]":{"name":"tw-kd","usedBy":{}},"before:dark:bg-gradient-to-br":{"name":"tw-ld","usedBy":{}},"before:shadow-mega-primary/40":{"name":"tw-md","usedBy":{}},"before:shadow-mega-primary/80":{"name":"tw-nd","usedBy":{}},"data-[state=closed]:ease-vaul":{"name":"tw-od","usedBy":{}},"data-[state=open]:blur-in-2xl":{"name":"tw-pd","usedBy":{}},"data-[state=open]:zoom-in-125":{"name":"tw-qd","usedBy":{}},"data-align=start:duration-400":{"name":"tw-rd","usedBy":{}},"data-disabled=true:opacity-50":{"name":"tw-sd","usedBy":{}},"data-state=closed:animate-out":{"name":"tw-td","usedBy":{}},"data-state=closed:zoom-out-95":{"name":"tw-ud","usedBy":{}},"hover:after:dark:to-[#0065FF]":{"name":"tw-vd","usedBy":{}},"hover:before:bg-purple-500/20":{"name":"tw-wd","usedBy":{}},"hover:before:bg-yellow-500/20":{"name":"tw-xd","usedBy":{}},"hover:text-mega-secondary/100":{"name":"tw-yd","usedBy":{}},"selection:text-mega-secondary":{"name":"tw-zd","usedBy":{}},"transition-[background-color]":{"name":"tw-ae","usedBy":{}},"after:dark:bg-gradient-to-br":{"name":"tw-be","usedBy":{}},"before:'

https://nextjs.org/docs/messages/module-not-found

./src/styles/overlay-scrollbar.css
Module not found: Can't resolve 'p-[var(--mega-body-padding)]":{"name":"tw-id","usedBy":{}},"[&_[cmdk-group-heading]]:px-2":{"name":"tw-jd","usedBy":{}},"after:transition-[background]":{"name":"tw-kd","usedBy":{}},"before:dark:bg-gradient-to-br":{"name":"tw-ld","usedBy":{}},"before:shadow-mega-primary/40":{"name":"tw-md","usedBy":{}},"before:shadow-mega-primary/80":{"name":"tw-nd","usedBy":{}},"data-[state=closed]:ease-vaul":{"name":"tw-od","usedBy":{}},"data-[state=open]:blur-in-2xl":{"name":"tw-pd","usedBy":{}},"data-[state=open]:zoom-in-125":{"name":"tw-qd","usedBy":{}},"data-align=start:duration-400":{"name":"tw-rd","usedBy":{}},"data-disabled=true:opacity-50":{"name":"tw-sd","usedBy":{}},"data-state=closed:animate-out":{"name":"tw-td","usedBy":{}},"data-state=closed:zoom-out-95":{"name":"tw-ud","usedBy":{}},"hover:after:dark:to-[#0065FF]":{"name":"tw-vd","usedBy":{}},"hover:before:bg-purple-500/20":{"name":"tw-wd","usedBy":{}},"hover:before:bg-yellow-500/20":{"name":"tw-xd","usedBy":{}},"hover:text-mega-secondary/100":{"name":"tw-yd","usedBy":{}},"selection:text-mega-secondary":{"name":"tw-zd","usedBy":{}},"transition-[background-color]":{"name":"tw-ae","usedBy":{}},"after:dark:bg-gradient-to-br":{"name":"tw-be","usedBy":{}},"before:'

https://nextjs.org/docs/messages/module-not-found

./src/styles/overlay-scrollbar.css
Module not found: Module not found: Error: Can't resolve 'p-[var(--mega-body-padding)]":{"name":"tw-id","usedBy":{}},"[&_[cmdk-group-heading]]:px-2":{"name":"tw-jd","usedBy":{}},"after:transition-[background]":{"name":"tw-kd","usedBy":{}},"before:dark:bg-gradient-to-br":{"name":"tw-ld","usedBy":{}},"before:shadow-mega-primary/40":{"name":"tw-md","usedBy":{}},"before:shadow-mega-primary/80":{"name":"tw-nd","usedBy":{}},"data-[state=closed]:ease-vaul":{"name":"tw-od","usedBy":{}},"data-[state=open]:blur-in-2xl":{"name":"tw-pd","usedBy":{}},"data-[state=open]:zoom-in-125":{"name":"tw-qd","usedBy":{}},"data-align=start:duration-400":{"name":"tw-rd","usedBy":{}},"data-disabled=true:opacity-50":{"name":"tw-sd","usedBy":{}},"data-state=closed:animate-out":{"name":"tw-td","usedBy":{}},"data-state=closed:zoom-out-95":{"name":"tw-ud","usedBy":{}},"hover:after:dark:to-[#0065FF]":{"name":"tw-vd","usedBy":{}},"hover:before:bg-purple-500/20":{"name":"tw-wd","usedBy":{}},"hover:before:bg-yellow-500/20":{"name":"tw-xd","usedBy":{}},"hover:text-mega-secondary/100":{"name":"tw-yd","usedBy":{}},"selection:text-mega-secondary":{"name":"tw-zd","usedBy":{}},"transition-[background-color]":{"name":"tw-ae","usedBy":{}},"after:dark:bg-gradient-to-br":{"name":"tw-be","usedBy":{}},"before:'

https://nextjs.org/docs/messages/module-not-found


> Build failed because of webpack errors

Let see if I can send you a reproduction later

@hoangnhan2ka3
Copy link

hoangnhan2ka3 commented Jul 16, 2024

hmmm I tried with Nextjs 14 and 15 boilerplate in CodeSandBox, it's just a default template of Nextjs with Tailwind, but I can't even use utwm from that. Please check the reproduction to see if I have any mistakes.

unhandledRejection TypeError: replaceMap.has is not a function
    at /project/workspace/app/globals.css:450:1
    at Root.<anonymous> (/project/workspace/node_modules/.pnpm/@tailwindcss-mangle+core@3.0.0/node_modules/@tailwindcss-mangle/core/dist/index.cjs:231:53)
    at /project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:193:25
    at /project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:172:20
    at Selector.each (/project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:159:16)
    at Selector.walk (/project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:171:17)
    at /project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:174:23
    at Root.each (/project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:159:16)
    at Root.walk (/project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:171:17)
    at Root.walkClasses (/project/workspace/node_modules/.pnpm/postcss-selector-parser@6.1.1/node_modules/postcss-selector-parser/dist/selectors/container.js:191:17)
    at Processor.func (/project/workspace/node_modules/.pnpm/@tailwindcss-mangle+core@3.0.0/node_modules/@tailwindcss-mangle/core/dist/index.cjs:230:21) {
  postcssNode: Rule {
    raws: { before: '\n', between: ' ', semicolon: true, after: '\n' },
    type: 'rule',
    nodes: [ [Declaration] ],
    parent: Root {
      raws: [Object],
      type: 'root',
      nodes: [Array],
      source: [Object],
      lastEach: 1,
      indexes: [Object],
      [Symbol(isClean)]: false,
      [Symbol(my)]: true
    },
    source: { input: [Input], start: [Object], end: [Object] },
    selector: '.tw-da',
    [Symbol(isClean)]: false,
    [Symbol(my)]: true
  }
}

@Superamaja
Copy link

Also having this problem with v3.0.1, I'm on NextJS 13.4.2

@laursenx
Copy link

unplugin-tailwindcss-mangle version 2.3.0 seems to still be working with nextjs version 14.2.15

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants