无法运行顺风/顺风项目

Question

我创建了一个小型项目并设置了tailwindui，当我试图启动项目时，我得到了这个错误:

postcss.config.js:1
[1] import tailwind from 'tailwindcss'
[1] ^^^^^^
[1]
[1] SyntaxError: Cannot use import statement outside a module

我也得到这个错误:

[0] [!] (plugin svelte) ParseError: Unexpected character '@'
[0] src/App.svelte
[0] 1: <script>
[0] 2:   @tailwind base;
[0]      ^
[0] 3:   @tailwind components;
[0] 4:   @tailwind utilities;
[0] ParseError: Unexpected character '@

这是我的postcss.config.css文件:

import autoprefixer from 'autoprefixer'
import nesting from 'postcss-nesting'
export default  {
syntax: 'postcss-scss',
plugins: [
nesting(),
tailwind(),
autoprefixer(),

],
};
};

你知道这里可能有什么问题吗?

感谢

Answer 1

你的postcss.config.js应该是这样的，如在tailwindcss文档

module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

要修复第二个错误，你必须将所有的tailwindcss导入放到一个样式标签中，像这样:

<style>
@tailwind base;
@tailwind components;
@tailwind utilities;
</style>

Answer 2

我已经设置了几次svelte + tailwind, tailwindcss文档很容易遵循，工作起来就像一个魅力