Javascript 语法错误:未知单词tailwind import语句赢得';行不通

Javascript 语法错误:未知单词tailwind import语句赢得';行不通,javascript,typescript,next.js,tailwind-css,css-loader,Javascript,Typescript,Next.js,Tailwind Css,Css Loader,在更改了tailwind.config.js之后,我进行了tailwind-nextJs配置。之后,编译就不起作用了。它抛出以下错误 error - ./src/assets/styles/global.css:3:1 Syntax error: Unknown word 1 | @import 'tailwindcss/base'; 2 | @import 'tailwindcss/components'; > 3 | @import 'tailwindcss/utilitie

在更改了
tailwind.config.js
之后,我进行了tailwind-nextJs配置。之后,编译就不起作用了。它抛出以下错误

error - ./src/assets/styles/global.css:3:1
Syntax error: Unknown word

  1 | @import 'tailwindcss/base';
  2 | @import 'tailwindcss/components';
> 3 | @import 'tailwindcss/utilities';
    |                                                              ^
  4 | @import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
  5 | 
wait  - compiling...
error - ./src/assets/styles/global.css:3:1
Syntax error: Unknown word

  1 | @import 'tailwindcss/base';
  2 | @import 'tailwindcss/components';
> 3 | @import 'tailwindcss/utilities';
    |                                                              ^
  4 | @import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
  5 | 
<w> [webpack.cache.PackFileCacheStrategy] Skipped not serializable cache item 'Compilation/modules|/Users/Anjula/slinc-frontend/node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[6].use[1]!/Users/Anjula/slinc-frontend/node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[6].use[2]!/Users/Anjula/slinc-frontend/src/assets/styles/global.css': No serializer registered for CssSyntaxError
<w> while serializing webpack/lib/cache/PackFileCacheStrategy.PackContentItems -> webpack/lib/NormalModule -> webpack/lib/ModuleBuildError -> CssSyntaxError
error-./src/assets/styles/global.css:3:1
语法错误:未知单词
1 |@导入“tailwindcss/base”;
2 |@导入“tailwindcss/组件”;
>3 |@导入“tailwindcss/utilities”;
|                                                              ^
4 |@导入url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
5 | 
等待-编译。。。
错误-./src/assets/styles/global.css:3:1
语法错误:未知单词
1 |@导入“tailwindcss/base”;
2 |@导入“tailwindcss/组件”;
>3 |@导入“tailwindcss/utilities”;
|                                                              ^
4 |@导入url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
5 | 
[webpack.cache.PackFileCacheStrategy]跳过了不可序列化的缓存项“Compilation/modules |/Users/Anjula/slinc frontend/node_modules/next/dist/compiled/css loader/cjs”??规则集[1]。规则[2]。其中一个[6]。使用[1]/Users/Anjula/slinc frontend/node_modules/next/dist/compiled/postss loader/cjs.js??规则集[1]。规则[2]。其中一个[6]。使用[2]/Users/Anjula/slinc frontend/src/assets/styles/global.css”:没有为CssSyntaxError注册序列化程序
序列化webpack/lib/cache/PackFileCacheStrategy.PackContentItems->webpack/lib/NormalModule->webpack/lib/ModuleBuildError->CssSyntaxError时
以下是github回购协议:

您的两种颜色在
tailwind.config.js
中有语法错误。只需删除rgba末尾的分号

更新
tailwind.config.js
by

改变

green: {
  100: 'rgba(14, 197, 65, 0.8);',
  200: '#0EC541',
  300: '#0D9B35',
},


您的两种颜色在
tailwind.config.js
中有语法错误。只需删除rgba末尾的分号

更新
tailwind.config.js
by

改变

green: {
  100: 'rgba(14, 197, 65, 0.8);',
  200: '#0EC541',
  300: '#0D9B35',
},


我看不到问题,我看不到问题。
gray: {
  100: '#F6F5F1',
  200: '#F1EEEE',
  300: '#DFDFDF',
  400: 'rgba(196, 196, 196, 0.3)',
  500: 'rgba(0, 0, 0, 0.1)',
  600: '#C4C4C4',
  700: 'rgba(0, 0, 0, 0.2)',
  800: 'linear-gradient(180deg, rgba(0, 0, 0, 0.24) 45.04%, rgba(0, 0, 0, 0) 72.07%);',
},
gray: {
  100: '#F6F5F1',
  200: '#F1EEEE',
  300: '#DFDFDF',
  400: 'rgba(196, 196, 196, 0.3)',
  500: 'rgba(0, 0, 0, 0.1)',
  600: '#C4C4C4',
  700: 'rgba(0, 0, 0, 0.2)',
  800: 'linear-gradient(180deg, rgba(0, 0, 0, 0.24) 45.04%, rgba(0, 0, 0, 0) 72.07%)',
},