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

vue3使用tailwindcss报错问题

  1. npm create vite@latest
  2. npm install -D tailwindcss postcss autoprefixer
  3. npx tailwindcss init
    4. ·不过执行 npx tailwindcss init 的时候控制台就报错了
    PS E:\vite-demo> npx tailwindcss init
    npm ERR! cb.apply is not a function
    npm ERR! A complete log of this run can be found in:
    
    1. 那就手动创建 tailwind.config.js文件和postcss.config.js文件
    	// tailwind.config.js/** @type {import('tailwindcss').Config} */module.exports = {content: ["./src/**/*.{html,js}"],theme: {extend: {},},plugins: [],}
    // postcss.config.js
    module.exports = {plugins: {tailwindcss: {},autoprefixer: {},}
    }
    
    然后再style.css引入
    @tailwind base;
    @tailwind components;
    @tailwind utilities;
    
    npm install
    报错
    [vite] Internal server error: [postcss] It looks like you're trying to use
    `tailwindcss` directly as a PostCSS plugin.The PostCSS plugin has
    moved to a separate package, so to continue using Tailwind CSS with PostCSS
    you'll need to install `@tailwindcss/postcss` and update your PostCSS configuration.
    
  4. 重新安装 npm install @tailwindcss/postcss
	import postcssTailwind from '@tailwindcss/postcss'; import autoprefixer from 'autoprefixer'; export default { plugins: [ postcssTailwind, autoprefixer ]};

注意: 要看清版本 现在安装的tailwindcss 是4.x 官网是3.x
地址:https://tailwindcss.com/

相关文章:

  • stm32之IIC
  • 内网穿透系列三:开源本地服务公网映射工具 tunnelmole
  • 初等数论--欧拉定理及证明
  • 数仓-范式建模、维度建模、雪花模型、星型模型对比及其适用范围
  • 基于OpenCV的人脸识别:FisherFaceRecognizer算法
  • vue2 上传pdf,拖拽盖章,下载图片
  • 项目管理从专家到小白
  • Information Fusion期刊期刊投稿经验分享
  • Docker使用小结
  • vim的配置
  • Qt解决自定义窗口样式不生效问题
  • 【小沐学GIS】基于C++绘制二维瓦片地图2D Map(QT、OpenGL、GIS)
  • Python与YOLO:自动驾驶中的实时物体检测
  • python:ASCII-generator 实用教程
  • MySQL COUNT(*) 查询优化详解!
  • AI文本分类
  • 【Web】LACTF 2025 wp
  • STM32CUBEIDE开发实战:ADC与UART应用
  • 【从零实现JsonRpc框架#3】线程模型与性能优化
  • Python----神经网络(《Deep Residual Learning for Image Recognition》论文和ResNet网络结构)
  • 国内大模型人才大战打响!大厂各出奇招
  • 构筑高地共伴成长,第六届上海创新创业青年50人论坛在沪举行
  • 卢正已任上海市司法局党委委员、副局长
  • 警方通报男子地铁上拍视频致乘客恐慌受伤:列车运行一度延误,已行拘
  • 巴军事行动致印度70%电网瘫痪
  • 心相印回应官方旗舰店客服辱骂消费者:正排查