当前位置: 首页 > news >正文

vite项目中引入tailwindcss,难倒AI的操作

官方教程

1. 创建您的项目

如果你还没有设置,请先创建一个新的 Vite 项目。最常见的方法是使用 Create Vite。

npm create vite@latest my-project
cd my-project

安装 Tailwind CSS

npm install tailwindcss @tailwindcss/vite

配置 Vite 插件

将插件添加到你的 Vite 配置中。@tailwindcss/vite

// vite.config.ts
import { defineConfig } from 'vite'
import tailwindcss from '@tailwindcss/vite'
export default defineConfig({plugins: [tailwindcss(),],
})

导入 Tailwind CSS

向 CSS 文件添加一个,用于导入 Tailwind CSS。@import

@import "tailwindcss";

开始构建过程

使用文件中配置的任何命令运行构建过程。npm run devpackage.json

npm run dev

开始在 HTML 中使用 Tailwind

确保编译后的 CSS 包含在 (框架可能会为你处理此问题) 中,然后开始使用 Tailwind 的实用程序类来设置内容的样式。

<!doctype html>
<html>
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link href="/src/style.css" rel="stylesheet">
</head>
<body><h1 class="text-3xl font-bold underline">Hello world!</h1>
</body>
</html>

不要过渡依赖AI,数据更新不及时

原因是,demo需要样式,用到了tailwindcss,按照AI的操作步骤,各种报错,后来看了这篇博客https://juejin.cn/post/7469422957593575433;
在这里插入图片描述

http://www.dtcms.com/a/264385.html

相关文章:

  • day48
  • 目前最火的agent方向-A2A快速实战构建(二): AutoGen模型集成指南:从OpenAI到本地部署的全场景LLM解决方案
  • C语言实战:2048数字合并游戏
  • 【C++】头文件的能力与禁忌
  • [Python 基础课程]数字
  • wrap+aria2c提高下载速度
  • 创宇智脑 MCP 赋能 AiPy,IP 风险调查效率实现 10 倍飞跃,威胁分析一键生成
  • c语言中的函数I
  • NV103NV105美光固态闪存NV107NV108
  • Python OrderedDict 用法详解
  • 【1.7 漫画Java核心并发编程】
  • 【硬核拆解】英伟达Blackwell芯片架构如何重构AI算力边界?
  • 第六章 OpenCV篇—傅里叶变换与直方图
  • 学习字符串
  • Flask+LayUI开发手记(十):构建统一的选项集合服务
  • Rust 定义与实例化结构体
  • php数据导出pdf文件
  • 目标检测系列(五)已标注数据集(yolo格式)导入labelstudio继续标注
  • 浏览器工作原理32 [#]同源策略:为什么XMLHttpRequst不能跨域请求资源
  • Android11 添加自定义物理按键事件监听回调
  • Nginx重定向协议冲突解决方案:The plain HTTP request was sent to HTTPS port
  • uniapp选择相册
  • CAD文件处理控件Aspose.CAD教程:使用 Python 将绘图转换为 Photoshop
  • 【基础】Golang 执行命令shell命令 + Start和Run方法详解
  • ES6数组的`flat()`和`flatMap()`函数用法
  • 黑马python(二十三)
  • vue2 el-select下拉选择框 点击其他位置或者弹窗关闭下拉框/点击取消时,下拉框变成之前的值
  • 2025年跨端云真机测试平台深度测评:XR与折叠屏时代的兼容性之战
  • 《量化开发》系列 第 1 篇:金融知识基础入门指南(附 GitHub 学习项目)
  • 什么是 BigKey?