1. 配置vite.config.ts Vite 默认支持通过 alias 来配置路径别名。我们需要在 vite.config.ts 中添加相关的别名配置。以下是示例: // vite.config.tsimport{defineConfig}from'vite';importreactfrom'@vitejs/plugin-react';import{resolve}from'path';exportdefaultdefineConfig({plugins:[react()],resolve:{alias...
exportdefaultdefineConfig({ build: {//打包输出的目录outDir:'lib',//防止 vite 将 rgba() 颜色转化为 #RGBA 十六进制cssTarget:'chrome61', lib: {//组件库源码的入口文件entry: resolve('packages/index.ts'),//组件库名称name:'MyPackages',//文件名称, 打包结果举例: my-packages.umd.cjsfileName:...
配置vite.config.ts exportdefaultdefineConfig((mode:ConfigEnv):UserConfig=>{constenv=loadEnv(mode.mode,process.cwd());constviteEnv=wrapperEnv(env);return{resolve:{alias:{"@":resolve(__dirname,"./src"),},},css:{preprocessorOptions:{less:{javascriptEnabled:true,additionalData:`@import "@/styl...
选择ts cd vite-project //安装依赖 npm install //启动项目 npm run dev ts以及vite的一些配置 根目录下的tsconfig.json配置ts { "compilerOptions": { "target": "ES2020",//指定 ECMAScript 目标版本,如 "ES3", "ES5", "ES2015", "ES2020", 或 "ESNEXT"。默认为 "ES3"。 "useDefineForClassFie...
我们只需要在vite.config.ts中添加如下配置: import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' import path from "path"; // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], resolve: { ...
vite构建的react+ts项目中使用less 下载less依赖 npminstallless 组件很多之间可能有类名相同,导致样式冲突,因此制定导出规则,给类名加上hash值。在vite.config.ts配置中添加以下规则。 css: { modules: { hashPrefix:'prefix', generateScopedName:'[name]__[local]__[hash:base64:5]',...
打开工程可以看到,vite默认了部分页面和配置,大多数其实都是无用的,需要进行下修剪。此处省略过程,有需要的可以(拉取源码)[https://github.com/supanpanCn/svite]查看 2.配置vite.config.ts 这里和vite+vue工程化配置是一样的,此处不再赘述,感兴趣的可直接跳转查看 ...
此文主要以ts+vite+router6+antd 快速搭建一个react项目,适用于初学者 一、项目搭建 采用pnpm,个人感觉比npm和yarn好用 npm i pnpm -g 1. 采用vite方式 ,根据选择 react-ts pnpm create vite 1. 1.1 修改初始结构,删除多余文件 1.2 修改vite.config配置文件 配置别名 ...
🚀 利用 Vite 实现飞速开发 💪 完整的 TypeScript 支持 🗂️ 结构清晰的项目 🔒 内置 JWT 认证 📡 现代数据获取,使用 Tanstack React Query 🗃️ 使用 Zustand 进行状态管理 🛣️ 使用 Tanstack Router 实现类型安全的文件路由 🌐 支持国际化 (i18n) ...
1、安装第三方Node包 npm i @types/node -D 2、配置别名路径 image.png import{defineConfig}from'vite'importreactfrom'@vitejs/plugin-react'importpathfrom'path'// https://vitejs.dev/config/exportdefaultdefineConfig({plugins:[react()],resolve:{alias:{'@':path.resolve(__dirname,'./src')}}}...