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

Cannot find any path matching /_tailwind/, when using baseUrl: "/dev/". Tailwind Config Viewer route bug. #883

Closed
richardevcom opened this issue Jul 29, 2024 · 1 comment
Labels
bug Something isn't working

Comments

@richardevcom
Copy link
Contributor

richardevcom commented Jul 29, 2024

Environment

I've only tested this on development environment, but I'm sure this can be replicated on production environment as well.

Here is my nuxt.config.ts:

export default defineNuxtConfig({
	compatibilityDate: "2024-04-03",
	css: ["~/assets/scss/main.scss"],
	modules: ["@nuxtjs/fontaine", "@tresjs/nuxt", "@nuxtjs/tailwindcss"],
	$development: {
		app: {
			baseURL: "/dev/",
		},
	},
})

Reproduction

Here is a live example: https://stackblitz.com/edit/github-1kxyp4?file=nuxt.config.ts. If you visit /dev/_tailwindcss in preview, you'll see that it works, but not the embedded config viewer in devtools.

Describe the bug

Whenever you set baseUrl (see config example in "Environment" above) to something other than / (for example, /dev/), Tailwind Config Viewer route for iframe within Nuxt DevTools uses /_tailwind/, but should be /dev/_tailwind/.

If I visit http://localhost:3000/dev/_tailwind/, it shows the config correctly, but the embedded Tailwind Config Viewer returns:

Cannot find any path matching /_tailwind/.

Additional context

Here is my package.json:

{
  "name": "nuxt-project",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@nuxtjs/fontaine": "latest",
    "@nuxtjs/tailwindcss": "latest",
    "@tresjs/nuxt": "^3.0.2",
    "nuxt": "^3.12.4",
    "three": "^0.167.0",
    "vue": "latest"
  },
  "devDependencies": {
    "sass": "^1.77.8"
  }
}

Logs

richardevcom:~/nuxt-project$ bun run dev
$ nuxt dev
Nuxt 3.12.4 with Nitro 2.9.7

  ➜ Local:    http://localhost:3000/dev/
  ➜ Network:  use --host to expose

ℹ Using default Tailwind CSS file
  ➜ DevTools: press Shift + Alt + D in the browser (v1.3.9)

ℹ Tailwind Viewer: http://localhost:3000/dev/_tailwind/
✔ Vite client built in 55ms
✔ Vite server built in 1024ms

✔ Nuxt Nitro server built in 639 ms
ℹ Vite client warmed up in 0ms
ℹ Vite server warmed up in 852ms

 WARN  [Vue Router warn]: No match found for location with path "/_tailwind/"
 WARN  [Vue Router warn]: No match found for location with path "/_tailwind/"
@richardevcom richardevcom added the bug Something isn't working label Jul 29, 2024
richardevcom added a commit to richardevcom/nuxtjs-tailwindcss that referenced this issue Jul 29, 2024
Fixed issue nuxt-modules#883: Cannot find any path matching /_tailwind/, when using baseUrl: '/dev/'.
Cannot find any path matching '/_tailwind/'
@richardevcom
Copy link
Contributor Author

richardevcom commented Jul 30, 2024

Tested the #885 hotfix and it works on both environments with / and /dev/ or /dev as baseURL.
Perhaps using ufo's cleanDoubleSlashes() is a shorter solution, when merging two strings.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant