vue ts+Windi CSS

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

javascript 复制代码
const { defineConfig } = require("@vue/cli-service");

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

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

3、开始编写主页

相关推荐
Python私教2 分钟前
Pure-Admin-Thin 深度解析:完整版和精简版到底怎么选?
vue.js·人工智能·开源
用户0595401744622 分钟前
把 Redis 持久化测试从 800 行 Shell 换成 30 行 pytest,排错效率翻了 10 倍
前端·css
Rkgua23 分钟前
事件流模型是什么和DOM事件模型等关系
javascript
W.A委员会27 分钟前
多行溢出在末尾添加省略号
开发语言·javascript·css
拉里呱唧2 小时前
一个像在使用PPT的在线 HTML 编辑器:HeyHTML
javascript·交互·html5
ayqy贾杰2 小时前
Cursor SDK发布!开发者可直接搬走其内核
前端·vue.js·面试
changshuaihua0012 小时前
扣子开发指南
javascript·人工智能
光影少年3 小时前
对typescript开发框架的理解?
前端·javascript·typescript
a1117763 小时前
“像风之翼“无人机巡检平台仪表盘
前端·javascript·开源·html·无人机
李白的天不白3 小时前
vue 数据格式问题
前端·vue.js·windows