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、开始编写主页

相关推荐
烛阴2 分钟前
告别繁琐的类型注解:TypeScript 类型推断完全指南
前端·javascript·typescript
gnip11 分钟前
工程项目中.env 文件原理
前端·javascript
JohnYan1 小时前
工作笔记 - CentOS7环境运行Bun应用
javascript·后端·容器
芜青2 小时前
HTML+CSS:浮动详解
前端·css·html
东风西巷3 小时前
Rubick:基于Electron的开源桌面效率工具箱
前端·javascript·electron·软件需求
Miracle_G4 小时前
每日一个知识点:JavaScript 箭头函数与普通函数比较
javascript
unfetteredman4 小时前
Error: /lib/x86_64-linux-gnu/libc.so.6: version `GLIBC_2.32' not found
前端·javascript·vite
HANK4 小时前
KLineChart 绘制教程
前端·vue.js
程序员小续5 小时前
React 官方严令禁止:Hook 不能写在 if/else,真相竟然是…
前端·javascript·程序员
Juchecar5 小时前
Naive UI 学习指南 - Vue3 初学者完全教程
前端·vue.js