vue3 + vite 配置tailwindcss
1. 如果您还没有设置Vite项目,请先创建一个新的Vite项目。最常见的方法是使用Create Vite。shnpm create vite@latest my-project -- --template vuecd my-project2. 安装 tailwindcss 及其对等依赖项,然后在项目根目录生成 tailwind.config.js 和 postcss.config.js 文件sh
1. 如果您还没有设置Vite项目,请先创建一个新的Vite项目。最常见的方法是使用Create Vite。shnpm create vite@latest my-project -- --template vuecd my-project2. 安装 tailwindcss 及其对等依赖项,然后在项目根目录生成 tailwind.config.js 和 postcss.config.js 文件sh
vitevue3项目配置记录参考文档https://cn.vitejs.dev/guide/基础配置JavaScriptexportdefaultdefineConfig({base:"",//配置css、js等资源为相对目录//...配置卸载这里define:{},plugins:[]})define-做一些文本替换的功能,在vue3中常见的是关闭options选项,以便打包之后缩小体积JavaScriptdefine:{__VUE_OPTIONS_API__:false,__VUE_PROD_DEVTOOLS__:false,},plugins-配置一些插件,也是vite最核心的部分**1
路由在前端开发当中很常见,频繁配置也是一项比较劳累的工作。自动化注入路由的开发模式,可以大大减少开发的时间。本文借助vite的import.meta.glob对文件进行全局加载,这种方式大大提高开发效率。