1、base配置打包公共路径 打开package.json 做项目时可以不去掉 好了,在以上你构建了vite,并配置了最简单的操作后,你准备配置vite.confing.ts 开发环境下我们的图片位置在/src,ok,本地没问题正常显示,你打了个包 (npm run build),然后又运行了npm脚本preview, 也没问题,但是在一些服务器上,使用绝对目录会导致4...
2、配置tsconfig.json (你都用@了别告诉我没在vite配置,这里不说@配置) compilerOptions里添加 "baseUrl":".","paths": {"@/*": ["src/*"] } 不报错了 四、vite打包分类文件输出配置以及静态资源拆分【配置】 直接打包后所有累心文件都存在一个文件内 1.文件分类输出,干净整洁舒心 配置一下config.ts文...
vite.config.ts配置 // https://vitejs.dev/config/exportdefaultdefineConfig({// ...build:{// 10kb以下,转Base64assetsInlineLimit:1024*10,// chunkSizeWarningLimit: 1500,//配置文件大小提醒限制,默认500rollupOptions:{output:{// 每个node_modules模块分成一个js文件manualChunks(id:string){if(id.inclu...
2.store/index.ts // createPinia函数并不需要显示引入 配置有自动导入// 持久化pinia插件importpiniaPluginPersistedstatefrom'pinia-plugin-persistedstate'// 创建pinia实例constpinia=createPinia()// 使用持久化插件pinia.use(piniaPluginPersistedstate)// 函数式注入piniaconstusePinia=(app)=>{app.use(pinia)}expo...
执行打包命令pnpm build gulp处理utils工具包 在utils下增加gulp配置文件gulpfile.ts,并且安装依赖gulp-typescript来处理ts文件 # 安装依赖 pnpm install gulp-typescript -w -D 复制代码 //gulpfile.ts import { buildPackages } from "../../build/packages" export default buildPackages(__dirname,'utils'...
首先我们使用pnpm包管理器搭建一个Vite项目,选择库打包模式。 pnpm create vite 输入我们项目的名称,然后选择框架,选择其他Others: 选择框架 这一步是选择项目的模板,我们在这里选择库模式: 模板 最终我们生成项目模板的基本目录结构如下: |- lib |- main.ts ...
build:{outDir:"lib",//输出文件名称lib:{entry:path.resolve(__dirname,"./src/plugins/index.ts"),//指定组件编译入口文件name:"vue-msg",fileName:"vue-msg",},//库编译模式配置rollupOptions:{// 确保外部化处理那些你不想打包进库的依赖external:["vue"],output:{// 在 UMD 构建模式下为这些外部...
1.修改配置文件 (1)修改【vite.config.ts】文件 修改前: import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'// https://vitejs.dev/config/exportdefaultdefineConfig({plugins: [vue()], }) 修改后: import{ defineConfig }from'vite'importvuefrom'@vitejs/plugin-vue'import{ ...