我使用"nPM Create vite@latest"设置了一个svelte应用程序, Select 使用Svelte和TypScript.我使用Vite作为服务器,并且我还按照说明here安装了TailWind CSS.

我的tailwind. connect.cjs代码:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./webapp/**/*.{svelte,html,ts}'],
  theme: {
    extend: {},
  },
  plugins: [],
}

我当前的app.css代码:

@tailwind base;
@tailwind components;
@tailwind utilities;

我在SRC文件夹中创建了一个rougs文件夹,其代码是:

<script>
  import "../app.css";
</script>

<slot />

我不断收到这个错误:

warn - The `content` option in your Tailwind CSS configuration is missing or empty.
warn - Configure your content sources or your generated CSS will be missing styles.
warn - https://tailwindcss.com/docs/content-configuration

我已停止服务器并再次运行它,但也出现了同样的问题.我已经判断了内容目录一百万次,甚至try 使用特定的文件路径.我似乎无法让它发挥作用.有人能帮我解决这个问题吗?我还包含了我的工作文件夹的图像.我真的很感激给予的任何见解.working folder

以上或多或少描述了;在阅读了大量文档和观看了无数视频后,我不确定我做错了什么.与我合作的开发人员正在使用Svelte、TS和Tailwind CSS,否则我会try 不同的方法.

推荐答案

由于Vite位于webapp文件夹中,因此就其构建/编译而言,它将是该项目的"根".考虑将postcss.config.jstailwind.config.cjs移至webapp文件夹中.

然后,考虑将tailwind.config.cjs中的content条路径更改为类似内容:

module.exports = {
  content: ['./src/**/*.{svelte,html,ts}'],

确保从webapp文件夹中运行vite命令.

Typescript相关问答推荐

创建一个通用上下文,允许正确推断其中的子项

Typescript对每个属性具有约束的通用类型

TypeScript将键传递给新对象错误

如何在函数参数中使用(或模仿)`success`的行为?

使用React处理Websocket数据

返回同时具有固定键和变量键的对象的函数的返回类型

单击并移除for循环中的一项也会影响另一项

具有泛型类方法的类方法修饰符

如何在ANGLE中注册自定义验证器

TypeScrip泛型类未提供预期的类型错误

有没有办法取消分发元组的联合?

如何将类似数组的对象(字符串::匹配结果)转换为类型脚本中的数组?

为什么发送空字段?

是否将Angular *ngFor和*ngIf迁移到新的v17语法?

在REACT查询中获取未定义的isLoading态

VUE 3类型';字符串';不可分配给类型';参考<;字符串&>

推断集合访问器类型

如何正确键入泛型相对记录值类型?

导航链接不触发自定义挂钩

Vite+Chrome扩展 list v3-;不能在模块外使用import语句;对于inpage脚本