Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

`render()` with a string template resolves Tailwind `@import`s from `process.cwd()`, ignoring `config.root`

Chiusa Adatta ai principianti
  • Qualcosa non va?
#1,914 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
78/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
tailwindcss, typescript
Ambito
frontend

Direzione di ricerca

Inizia da transformers/tailwindcss.js e transformers/tailwindComponent.js, poi confronta il modo in cui server/compatibility.js e server/linter.js usano config.root. Verifica il percorso del template string durante il rendering da una directory di lavoro che non può risolvere il pacchetto Tailwind; il lavoro è terminato quando gli import vengono risolti usando config.root e il comportamento predefinito esistente viene mantenuto.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

When render() is given an SFC string (not a file path), the Tailwind transformers compile its <style> with from: resolve(process.cwd(), "template.vue"). Tailwind resolves @import "@maizzle/tailwindcss" relative to that from, so the render only works when the process's working directory can resolve the package. Passing root has no effect on this.

This bites servers whose working directory is not where their node_modules live — e.g. a Nitro/Nuxt production build started from /app with packages in /app/.output/server/node_modules. Tailwind fails with Can't resolve '@maizzle/tailwindcss' in '/app', Maizzle keeps going, and the email is returned unstyled.

Reproduction

import { render } from '@maizzle/framework'

process.chdir('/') // any directory that cannot resolve @maizzle/tailwindcss

const { html } = await render(`
<template>
  <Html><Head><style>@import "@maizzle/tailwindcss";</style></Head>
  <Body><p class="text-red-500">Hello</p></Body></Html>
</template>`, { root: '/path/to/project' })

// Logs: Can't resolve '@maizzle/tailwindcss' in '/'
// `html` has no Tailwind styles.

Expected

A string template resolves its imports from config.root, the same way server/compatibility.js and server/linter.js already use config.root ?? process.cwd().

Suggested fix

In transformers/tailwindcss.js and transformers/tailwindComponent.js:

- const fromPath = filePath ?? resolve(process.cwd(), "template.vue");
+ const fromPath = filePath ?? resolve(config.root ?? process.cwd(), "template.vue");

normalizeConfig always sets config.root (defaulting to process.cwd()), so behaviour is unchanged for callers that don't pass it.

Related

plugins/postcss/resolveMaizzleImports.js is meant to rewrite @maizzle/tailwindcss imports to absolute paths, but it runs as an AtRule visitor, and PostCSS runs all Once hooks, including @tailwindcss/postcss's, before visitors. Tailwind has already resolved (or failed to resolve) the import by the time the rewrite happens, so it never helps. Running it in Once would fix that.

Lingua principale
TypeScript
Stelle
1.6k
Fork
69
Merge medio
17h 23m
PR unite (30g)
45

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.