laravel vscode顺风css智能感知不工作

6za6bjd0  于 2022-12-01  发布在  Vscode
关注(0)|答案(4)|浏览(241)

我有一个问题。我正在学习laravel 8和tailwind CSS。和作为标题vscode tailwind CSS Intellisense不工作。我的tailwind CSS版本是2.2.15. tailwind.config.js喜欢的照片。enter image description here输出没有错误enter image description here
那么我能对这个问题做些什么呢?

6mw9ycah

6mw9ycah1#

Tailwind CSS IntelliSense扩展在您的工作区中有配置文件之前是不起作用的,正如它的描述中明确指出的那样!
即使只使用CDN也没问题,但必须在项目的根目录中创建一个tailwind.config.js文件,至少包含defaults

module.exports = {
  content: ["./src/**/*.{html,js}"],
  theme: {
    extend: {},
  },
  plugins: [],
}

此外,由于您使用的是Laravel,我猜您需要添加刀片文件,以通过此VSC设置(在settings.json中)由扩展识别:

"tailwindCSS.includeLanguages": {
    "blade": "html",
},
  • 最后一点:content路径将由Tailwind的JIT引擎处理;了解它是关键!*
iyfjxgzm

iyfjxgzm2#

可能的解决方案

禁用单个VS代码扩展名:“引导程序4,字体真棒4,字体真棒5免费&专业代码段”

证据

Tailwind CSS IntelliSense在我的Angular项目中不起作用。我已经按照他们的说明安装了Tailwind CSS:
单击here

我的版本

  • VS代码:1.62.3
  • 顺风CSS:3.0.1
  • Angular :13.0.3

我禁用了上面提到的“可能的解决方案”,Tailwind CSS IntelliSense立即工作。
Demo of Tailwinds CSS IntelliSense in my Angular project

j91ykkif

j91ykkif3#

我有同样的问题,而工作的顺风与laravel。
卸载和重新安装tailwind intellisense扩展解决了我的问题。
此外,不要忘记在Blade文件的部分中添加以下内容:

<link href="{{ asset('css/app.css') }}" rel="stylesheet">
ogsagwnx

ogsagwnx4#

对我来说,这似乎是我的一个扩展的问题。
我需要卸载“ emmet 现场”扩展和安装“秘银 emmet ”扩展。
正如其他一些答案所建议的,确保您也将以下内容放入settings.json中:

"tailwindCSS.emmetCompletions": true,
  "editor.inlineSuggest.enabled": true,
  "editor.quickSuggestions": {
    "strings": true
  },
"css.validate": false

相关问题