当前位置： 首页 > article >正文

vue ts+Windi CSS

article 2025/3/31 4:46:43

1、创建vue项目

trae（字节）打开一个空文件夹

npm install -g @vue/cli
vue create my-project
cd my-project
vue add typescript
npm run serve

vue项目创建完成

2、安装windicss

vue add windicss

vue.config.js配置

npm install vue-router vuex windicss

const { defineConfig } = require("@vue/cli-service");

module.exports = defineConfig({
  transpileDependencies: true,
  publicPath: process.env.NODE_ENV === "production" ? "./" : "/",

  pluginOptions: {
    windicss: {
      // 在这里可以配置 WindiCSS 的相关选项
    },
  },
});

3、开始编写主页


http://www.kler.cn/a/612180.html

相关文章：

  • CTFshow【命令执行】web29-web40 做题笔记
  • 未来工程项目管理新走向：云原生软件赋能绿色可持续建设
  • Kafka 面试备战指南
  • eureka与ribbon混合使用
  • Linux设置SSH免密码密钥登录
  • Netty和Project Reactor如何共同处理大数据流？
  • 无人机抗风测试技术要点概述！
  • failed to load steamui.dll”错误：Steam用户的高频崩溃问题解析
  • LLaMA-Factory使用实战
  • Elasticsearch 之 ElasticsearchRestTemplate 聚合查询
  • Java版Manus实现来了，Spring AI Alibaba发布开源OpenManus实现
  • Linux驱动开发--IIC子系统
  • 基于HTML5的3D魔方项目开发实践
  • leetcode 150. 逆波兰表达式求值
  • 22、web前端开发之html5（三）
  • HarmonyOS Next～鸿蒙系统开发类Kit深度解析与应用实践
  • 211、【图论】建造最大岛屿（Python）
  • 计算机网络——传输层(TCP)
  • 广东新政激发产业活力，凡拓数创以全场景AI3D方案领跑机器人赛道
  • Go File容器化部署方案：本地快速搭建与无公网IP远程传输文件指南