Nuxt 3.15 "Unexpected token" #2971

pxdev · 2024-12-25T09:29:00Z

Environment

Operating System: Darwin
Node Version: v20.10.0
Nuxt Version: 3.15.0
CLI Version: 3.17.2
Nitro Version: 2.10.4
Package Manager: [email protected]
Builder: -
User Config: default
Runtime Modules: @vueuse/[email protected], @nuxtjs/[email protected], @nuxt/[email protected], @nuxt/[email protected], @hebilicious/[email protected], @nuxt/[email protected]
Build Modules: -

Version

v2.20.0

Reproduction

Description

Just upgraded my Nuxt version to 3.15, and I noticed that modal or slide over components for now are not working
they have updated the vite version, and I think this is the issue here.

Additional context

No response

Logs

ERROR  Unexpected token ';'

    function g(e=""){return e.split(/\s+/).filter(t=>t.length>1)}let R=Symbol("TransitionContext");var pe=(a=>(a.Visible="visible",a.Hidden="hidden",a))(pe||{});function me(){return (0,__vite_ssr_import_0__.inject)(R,null)!==null}function Te(){let e=(0,__vite_ssr_import_0__.inject)(R,null);if(e===null)throw new Error("A <TransitionChild /> is used but it is missing a parent <TransitionRoot />.");return e}function ge(){let e=(0,__vite_ssr_import_0__.inject)(N,null);if(e===null)throw new Error("A <TransitionChild /> is used but it is missing a parent <TransitionRoot />.");return e}let N=Symbol("NestingContext");function L(e){return"children"in e?L(e.children):e.value.filter(({state:t})=>t==="visible").length>0}function Q(e){let t=(0,__vite_ssr_import_0__.ref)([]),a=(0,__vite_ssr_import_0__.ref)(!1);(0,__vite_ssr_import_0__.onMounted)(()=>a.value=!0),(0,__vite_ssr_import_0__.onUnmounted)(()=>a.value=!1);function s(n,r=__vite_ssr_import_6__.RenderStrategy.Hidden){let l=t.value.findIndex(({id:f})=>f===n);l!==-1&&((0,__vite_ssr_import_5__.match)(r,{[__vite_ssr_import_6__.RenderStrategy.Unmount](){t.value.splice(l,1)},[__vite_ssr_import_6__.RenderStrategy.Hidden](){t.value[l].state="hidden"}}),!L(t)&&a.value&&(e==null||e()))}function h(n){let r=t.value.find(({id:l})=>l===n);return r?r.state!=="visible"&&(r.state="visible"):t.value.push({id:n,state:"visible"}),()=>s(n,__vite_ssr_import_6__.RenderStrategy.Unmount)}return{children:t,register:h,unregister:s}}let W=__vite_ssr_import_6__.Features.RenderStrategy,he=(0,__vite_ssr_import_0__.defineComponent)({props:{as:{type:[Object,String],default:"div"},show:{type:[Boolean],default:null},unmount:{type:[Boolean],default:!0},appear:{type:[Boolean],default:!1},enter:{type:[String],default:""},enterFrom:{type:[String],default:""},enterTo:{type:[String],default:""},entered:{type:[String],default:""},leave:{type:[String],default:""},leaveFrom:{type:[String],default:""},leaveTo:{type:[String],default:""}},emits:{beforeEnter:()=>!0,afterEnter:()=>!0,beforeLeave:()=>!0,afterLeave:()=>!0},setup(e,{emit:t,attrs:a,slots:s,expose:h}){let n=(0,__vite_ssr_import_0__.ref)(0);function r(){n.value|=__vite_ssr_import_2__.State.Opening,t("beforeEnter")}function l(){n.value&=~__vite_ssr_import_2__.State.Opening,t("afterEnter")}function f(){n.value|=__vite_ssr_import_2__.State.Closing,t("beforeLeave")}function S(){n.value&=~__vite_ssr_import_2__.State.Closing,t("afterLeave")}if(!me()&&(0,__vite_ssr_import_2__.hasOpenClosed)())return()=>(0,__vite_ssr_import_0__.h)(Se,{...e,onBeforeEnter:r,onAfterEnter:l,onBeforeLeave:f,onAfterLeave:S},s);let d=(0,__vite_ssr_import_0__.ref)(null),y=(0,__vite_ssr_import_0__.computed)(()=>e.unmount?__vite_ssr_import_6__.RenderStrategy.Unmount:__vite_ssr_import_6__.RenderStrategy.Hidden);h({el:d,$el:d});let{show:v,appear:A}=Te(),{register:D,unregister:H}=ge(),i=(0,__vite_ssr_import_0__.ref)(v.value?"visible":"hidden"),I={value:!0},c=(0,__vite_ssr_import_1__.useId)(),b={value:!1},P=Q(()=>{!b.value&&i.value!=="hidden"&&(i.value="hidden",H(c),S())});(0,__vite_ssr_import_0__.onMounted)(()=>{let o=D(c);(0,__vite_ssr_import_0__.onUnmounted)(o)}),(0,__vite_ssr_import_0__.watchEffect)(()=>{if(y.value===__vite_ssr_import_6__.RenderStrategy.Hidden&&c){if(v.value&&i.value!=="visible"){i.value="visible";return}(0,;__vite_ssr_import_5__.match)(i.value,{["hidden"]:()=>H(c),["visible"]:()=>D(c)})}});let j=g(e.enter),M=g(e.enterFrom),X=g(e.enterTo),_=g(e.entered),Y=g(e.leave),Z=g(e.leaveFrom),ee=g(e.leaveTo);(0,__vite_ssr_import_0__.onMounted)(()=>{(0,__vite_ssr_import_0__.watchEffect)(()=>{if(i.value==="visible"){let o=(0,__vite_ssr_import_3__.dom)(d);if(o instanceof Comment&&o.data==="")throw new Error("Did you forget to passthrough the ref to the actual DOM node?")}})});function te(o){let E=I.value&&!A.value,p=(0,__vite_ssr_import_3__.dom)(d);!p||!(p instanceof HTMLElement)||E||(b.value=!0,v.value&&r(),v.value||f(),o(v.value?(0,__vite_ssr_import_7__.transition)(p,j,M,X,_,V=>{b.value=!1,V===__vite_ssr_import_7__.Reason.Finished&&l()}):(0,__vite_ssr_import_7__.transition)(p,Y,Z,ee,_,V=>{b.value=!1,V===__vite_ssr_import_7__.Reason.Finished&&(L(P)||(i.value="hidden",H(c),S()))})))}return (0,__vite_ssr_import_0__.onMounted)(()=>{(0,__vite_ssr_import_0__.watch)([v],(o,E,p)=>{te(p),I.value=!1},{immediate:!0})}),(0,__vite_ssr_import_0__.provide)(N,P),(0,__vite_ssr_import_2__.useOpenClosedProvider)((0,__vite_ssr_import_0__.computed)(()=>(0,__vite_ssr_import_5__.match)(i.value,{["visible"]:__vite_ssr_import_2__.State.Open,["hidden"]:__vite_ssr_import_2__.State.Closed})|n.value)),()=>{let{appear:o,show:E,enter:p,enterFrom:V,enterTo:Ce,entered:ye,leave:be,leaveFrom:Ee,leaveTo:Ve,...U}=e,ne={ref:d},re={...U,...A.value&&v.value&&__vite_ssr_import_4__.env.isServer?{class:(0,__vite_ssr_import_0__.normalizeClass)([a.class,U.class,...j,...M])}:{}};return (0,__vite_ssr_import_6__.render)({theirProps:re,ourProps:ne,slot:{},slots:s,attrs:a,features:W,visible:i.value==="visible",name:"TransitionChild"})}}}),ce=he,Se=(0,__vite_ssr_import_0__.defineComponent)({inheritAttrs:!1,props:{as:{type:[Object,String],default:"div"},show:{type:[Boolean],default:null},unmount:{type:[Boolean],default:!0},appear:{type:[Boolean],default:!1},enter:{type:[String],default:""},enterFrom:{type:[String],default:""},enterTo:{type:[String],default:""},entered:{type:[String],default:""},leave:{type:[String],default:""},leaveFrom:{type:[String],default:""},leaveTo:{type:[String],default:""}},emits:{beforeEnter:()=>!0,afterEnter:()=>!0,beforeLeave:()=>!0,afterLeave:()=>!0},setup(e,{emit:t,attrs:a,slots:s}){let h=(0,__vite_ssr_import_2__.useOpenClosed)(),n=(0,__vite_ssr_import_0__.computed)(()=>e.show===null&&h!==null?(h.value&__vite_ssr_import_2__.State.Open)===__vite_ssr_import_2__.State.Open:e.show);(0,__vite_ssr_import_0__.watchEffect)(()=>{if(![!0,!1].includes(n.value))throw new Error('A <Transition /> is used but it is missing a :show="true | false" prop.')});let r=(0,__vite_ssr_import_0__.ref)(n.value?"visible":"hidden"),l=Q(()=>{r.value="hidden"}),f=(0,__vite_ssr_import_0__.ref)(!0),S={show:n,appear:(0,__vite_ssr_import_0__.computed)(()=>e.appear||!f.value)};return (0,__vite_ssr_import_0__.onMounted)(()=>{(0,__vite_ssr_import_0__.watchEffect)(()=>{f.value=!1,n.value?r.value="visible":L(l)||(r.value="hidden")})}),(0,__vite_ssr_import_0__.provide)(N,l),(0,__vite_ssr_import_0__.provide)(R,S),()=>{let d=(0,__vite_ssr_import_6__.omit)(e,["show","appear","unmount","onBeforeEnter","onBeforeLeave","onAfterEnter","onAfterLeave"]),y={unmount:e.unmount};return (0,__vite_ssr_import_6__.render)({ourProps:{...y,as:"template"},theirProps:{},slot:{},slots:{...s,default:()=>[(0,__vite_ssr_import_0__.h)(ce,{onBeforeEnter:()=>t("beforeEnter"),onAfterEnter:()=>t("afterEnter"),onBeforeLeave:()=>t("beforeLeave"),onAfterLeave:()=>t("afterLeave"),...a,...y,...d},s.default)]},attrs:{},features:W,visible:r.value==="visible",name:"Transition"})}}});
    
    
    SyntaxError: Unexpected token ';'
    at new Script (node:vm:99:7)
    at createScript (node:vm:247:10)
    at Object.runInThisContext (node:vm:295:10)
    at ViteNodeRunner.runModule (node_modules/vite-node/dist/client.mjs:398:19)
    at ViteNodeRunner.directRequest (node_modules/vite-node/dist/client.mjs:381:16)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async ViteNodeRunner.cachedRequest (node_modules/vite-node/dist/client.mjs:206:14)
    at async ViteNodeRunner.dependencyRequest (node_modules/vite-node/dist/client.mjs:259:12)
    at async node_modules/@headlessui/vue/dist/headlessui.esm.js:23:32
    at async ViteNodeRunner.runModule (node_modules/vite-node/dist/client.mjs:399:5)

The text was updated successfully, but these errors were encountered:

vinayakkulkarni · 2024-12-25T14:24:06Z

ℹ Vite server warmed up in 20ms                                                                                                                                                                                                                                 9:59:33 AM

 ERROR  [nuxt] [request error] [unhandled] [500] Unexpected token ';'



 ERROR  [nuxt] [request error] [unhandled] [500] Unexpected token ';'



 ERROR  [nuxt] [request error] [unhandled] [500] Unexpected token ';'



 ERROR  [nuxt] [request error] [unhandled] [500] Unexpected token ';'



 ERROR  [nuxt] [request error] [unhandled] [500] Unexpected token ';'



[9:59:54 AM]  ERROR  Internal server error: ENOENT: no such file or directory, open 'node_modules/.pnpm/@[email protected][email protected][email protected][email protected][email protected][email protected]_@_hycv3cbrmipfqwjo7hddt24ebi/node_modules/@nuxt/ui/dist/runtime/components/forms/Select.vue'
      at Object.readFileSync (node:fs:448:20)
      at getDescriptor (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:114:18)
      at LoadPluginContext.load (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:2960:28)
      at EnvironmentPluginContainer.load (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:47187:17)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async loadAndTransform (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:40959:22)


[9:59:54 AM]  ERROR  Internal server error: ENOENT: no such file or directory, open 'node_modules/.pnpm/@[email protected][email protected][email protected][email protected][email protected][email protected]_@_hycv3cbrmipfqwjo7hddt24ebi/node_modules/@nuxt/ui/dist/runtime/components/forms/Select.vue'
      at Object.readFileSync (node:fs:448:20)
      at getDescriptor (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:114:18)
      at LoadPluginContext.load (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:2960:28)
      at EnvironmentPluginContainer.load (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:47187:17)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async loadAndTransform (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:40959:22)
      at async viteTransformMiddleware (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:42469:24)


[9:59:54 AM]  ERROR  Internal server error: ENOENT: no such file or directory, open 'node_modules/.pnpm/@[email protected][email protected][email protected][email protected][email protected][email protected]_@_hycv3cbrmipfqwjo7hddt24ebi/node_modules/@nuxt/ui/dist/runtime/components/elements/Progress.vue'
      at Object.readFileSync (node:fs:448:20)
      at getDescriptor (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:114:18)
      at LoadPluginContext.load (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:2960:28)
      at EnvironmentPluginContainer.load (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:47187:17)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async loadAndTransform (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:40959:22)


[9:59:54 AM]  ERROR  Internal server error: ENOENT: no such file or directory, open 'node_modules/.pnpm/@[email protected][email protected][email protected][email protected][email protected][email protected]_@_hycv3cbrmipfqwjo7hddt24ebi/node_modules/@nuxt/ui/dist/runtime/components/elements/Progress.vue'
      at Object.readFileSync (node:fs:448:20)
      at getDescriptor (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:114:18)
      at LoadPluginContext.load (file://node_modules/.pnpm/@[email protected][email protected]_@[email protected][email protected][email protected][email protected]__eoqfevsfkx5laqzmh2smxkt6vq/node_modules/@vitejs/plugin-vue/dist/index.mjs:2960:28)
      at EnvironmentPluginContainer.load (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:47187:17)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async loadAndTransform (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:40959:22)
      at async viteTransformMiddleware (file://node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected][email protected][email protected]/node_modules/vite/dist/node/chunks/dep-BZMjGe_U.js:42469:24)

Facing similar issue after upgrading to Nuxt 3.15 which uses Vite 6 under the hood.

miguelrk · 2024-12-25T14:45:11Z

I can also confirm this, that after upgrading to nuxt 3.15, I'm also getting ERROR Unexpected token ';' when running the dev server. Builds seem to work as expected.

danielroe · 2024-12-25T15:01:06Z

I'll be investigating. It feels like this might be a core nuxt book.

estoforshort · 2024-12-25T15:29:16Z

I can also confirm this, that after upgrading to nuxt 3.15, I'm also getting ERROR Unexpected token ';'

Getting the same error when running the dev server. Builds seem to work as expected.

vinayakkulkarni · 2024-12-25T16:13:00Z

I can also confirm this, that after upgrading to nuxt 3.15, I'm also getting ERROR Unexpected token ';' when running the dev server. Builds seem to work as expected.

Oh yeah, this only happens in dev mode, pnpm dev, it works flawlessly when built.

danielroe · 2024-12-25T20:45:49Z

I can't reproduce with the linked reproduction.

Would you be able to provide one for me to check? 🙏

pxdev · 2024-12-25T20:48:56Z

@danielroe you have to insert u-modal or u-slideover components

pxdev · 2024-12-25T21:11:16Z

"I deleted the node_modules folder and reinstalled the dependencies, which fixed the issue. Previously, I was using Nuxt 3.12.0 and had used nuxi to upgrade. That might have been the cause of the problem."

pxdev · 2024-12-25T21:22:18Z

https://stackblitz.com/edit/nuxt-ui-wyom3r2g?file=package.json,app.vue

danielroe · 2024-12-25T22:07:11Z

I think this might be a Vite (or esbuild) issue.

The problematic file is @headlessui/vue/dist/components/transitions/transition.js, and it doesn't reproduce if pinning vite@5.

atabek2000 · 2024-12-26T07:09:57Z

I also encounter this error when I use UModal, USlideover, or UPopover.

KunNew · 2024-12-26T09:07:22Z

I also encountered this error: [nuxt] [request error] [unhandled] [500] Unexpected token ';' , when i try to install @nuxt/fonts package

mwc · 2024-12-26T09:22:38Z

@danielroe Would you happen to have a temporary or emergency workaround available?

vernaillen · 2024-12-26T09:33:09Z

@danielroe Would you happen to have a temporary or emergency workaround available?

As Daniel already mentioned, you can pin vite to v5.

For example for pnpm:

  "pnpm": {
    "overrides": {
      "vite": "5.4.11"
    }
  }

vinayakkulkarni · 2024-12-26T09:35:42Z

@danielroe Would you happen to have a temporary or emergency workaround available?

I just reverted to Nuxt v3.14 and it worked, really want to try v3.15 w/ Vite 6 but maybe til it's resolved, we'll have to revert to v3.14 or with overrides solution

agotfredsen82 · 2024-12-26T11:54:17Z

Any fix in this using yarn same issue revert to Nuxt 3.14 "solves" issue but there are other issues with Nuxt 3.14 so any fix on this would be great asap. running Nuxt ui pro

phyzerbert · 2024-12-26T13:40:15Z

I also encounter this error when I use UDropdown.

TheAlexLichter · 2024-12-26T14:36:06Z

To everyone asking for a fix, there are two workarounds at the moment:

Downgrade your Vite version via package.json. You can do so in all package managers. Yarn, PNPM, NPM, Bun. Pinning Vite to the latest 5.x version is sufficient

OR

Downgrade your nuxt version to 3.14, which forces Vite into 5.x automatically.

When the issue is resolved upstream, you can remove the workaround.

pxdev added bug Something isn't working triage labels Dec 25, 2024

HugoRCD mentioned this issue Dec 25, 2024

Syntax error in the Headless UI Vue component code #2972

Closed

benjamincanac marked this as a duplicate of #2972 Dec 25, 2024

danielroe added the needs reproduction label Dec 25, 2024

danielroe added upstream and removed needs reproduction triage labels Dec 26, 2024

danielroe mentioned this issue Dec 26, 2024

Upgrade to Nuxt 3.15.0 led to 500 (Internal Server Error) nuxt/nuxt#30384

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Nuxt 3.15 "Unexpected token" #2971

Nuxt 3.15 "Unexpected token" #2971

pxdev commented Dec 25, 2024

vinayakkulkarni commented Dec 25, 2024

miguelrk commented Dec 25, 2024 •

edited

Loading

danielroe commented Dec 25, 2024

estoforshort commented Dec 25, 2024

vinayakkulkarni commented Dec 25, 2024

danielroe commented Dec 25, 2024

pxdev commented Dec 25, 2024 •

edited

Loading

pxdev commented Dec 25, 2024 •

edited

Loading

pxdev commented Dec 25, 2024

danielroe commented Dec 25, 2024

atabek2000 commented Dec 26, 2024

KunNew commented Dec 26, 2024

mwc commented Dec 26, 2024

vernaillen commented Dec 26, 2024

vinayakkulkarni commented Dec 26, 2024

agotfredsen82 commented Dec 26, 2024

phyzerbert commented Dec 26, 2024

TheAlexLichter commented Dec 26, 2024 •

edited

Loading

Nuxt 3.15 "Unexpected token" #2971

Nuxt 3.15 "Unexpected token" #2971

Comments

pxdev commented Dec 25, 2024

Environment

Version

Reproduction

Description

Additional context

Logs

vinayakkulkarni commented Dec 25, 2024

miguelrk commented Dec 25, 2024 • edited Loading

danielroe commented Dec 25, 2024

estoforshort commented Dec 25, 2024

vinayakkulkarni commented Dec 25, 2024

danielroe commented Dec 25, 2024

pxdev commented Dec 25, 2024 • edited Loading

pxdev commented Dec 25, 2024 • edited Loading

pxdev commented Dec 25, 2024

danielroe commented Dec 25, 2024

atabek2000 commented Dec 26, 2024

KunNew commented Dec 26, 2024

mwc commented Dec 26, 2024

vernaillen commented Dec 26, 2024

vinayakkulkarni commented Dec 26, 2024

agotfredsen82 commented Dec 26, 2024

phyzerbert commented Dec 26, 2024

TheAlexLichter commented Dec 26, 2024 • edited Loading

miguelrk commented Dec 25, 2024 •

edited

Loading

pxdev commented Dec 25, 2024 •

edited

Loading

pxdev commented Dec 25, 2024 •

edited

Loading

TheAlexLichter commented Dec 26, 2024 •

edited

Loading