Closed Neewd closed 3 years ago
Haha that's definetely on the heroicons side though
Haha that's definetely on the heroicons side though
:D sorry headlessui problem
http://localhost:3000/modal reload page and see problem thats true ?
https://github.com/tailwindlabs/headlessui/blob/main/jest/create-jest-config.js
I think this place needs to be updated, I don't have full knowledge of these issues, but I will try to find out. Please have a look, if you find a solution, you will return.
I think the library needs to be updated. Seems like it's not related to nuxt.
had same issue with headlessui the fix will come in next release here's the temp fix
npm install @headlessui/vue@dev
get the latest dev build of headlessui
import { defineNuxtConfig } from "nuxt3";
export default defineNuxtConfig({
build: {
postcss: {
postcssOptions: {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
},
},
transpile: ["@headlessui/vue"],
},
});
the transpile part is important.
The issue is still up on this repo ?
The issue is still up on this repo ?
https://github.com/productdevbook/nuxt3-app/pull/18 We are still waiting for @headlessui updates.
Environment
npx nuxi info
-->Nuxt CLI v3.0.0-27238235.a1bcc53 09:48:49 RootDir: C:\Users\Windows\Developpement\hiddengems\nuxt3-app 09:48:50 Nuxt project info: 09:48:50
Windows_NT
v14.17.3
3-3.0.0-27238235.a1bcc53
Yarn
Webpack
buildModules
,build
-
Build Modules:
-
http://localhost:3000/modal reload page
Describe the bug
After cloning a TailwindUI template inside the
app.vue
, running the npm i and npm run dev, here is the result I have ...(node:13788) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension. (Use
node --trace-warnings ...
to show where the warning was created) Server Side Rendering Error: C:\Users\Windows\Developpement\hiddengems\nuxt3-app\node_modules\@headlessui\vue\dist\headlessui.esm.js:1 import { cloneVNode, h, onUnmounted, ref, watchEffect, onUpdated, inject, provide, defineComponent, Teleport, reactive, computed, unref, onMounted, nextTick, toRaw, watch } from 'vue'; ^^^^^^SyntaxError: Cannot use import statement outside a module at wrapSafe (internal/modules/cjs/loader.js:1001:16) at Module._compile (internal/modules/cjs/loader.js:1049:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10) at Module.load (internal/modules/cjs/loader.js:950:32) at Function.Module._load (internal/modules/cjs/loader.js:790:14) at ModuleWrap. (internal/modules/esm/translators.js:199:29)
at ModuleJob.run (internal/modules/esm/module_job.js:169:25)
at async Loader.import (internal/modules/esm/loader.js:177:24)
Not sure it's linked to your repo or nuxt3 but I'll post it anyway :) I can give further info if you want :)
Additional context
No response
Logs
No response