使用vite build 后移动 index.html 到后端目录中

最新推荐文章于 2025-04-27 13:17:17 发布
最新推荐文章于 2025-04-27 13:17:17 发布
阅读量1.4k 收藏 6
点赞数 10
文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/zhaojjjjjj163/article/details/135776090
版权
本文介绍了如何在Vite项目中使用`package.json`中的scripts命令进行构建，并通过`vite.config.js`调整静态资源路径和打包选项，如将`index.html`移动并压缩到微信小程序的`/static/wxmp`目录。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

package.json

"scripts": {

"build": "vite build && mv ../think/public/static/wxmp/index.html ../think/view/wxmp/home_index.html", //移动index.html 到指定位置

}

vite.config.js

base: '/static/wxmp', // 修改静态资源路径

build: {

outDir: '../think/public/static/wxmp', //打包到的位置

minify: true, //是否压缩

},

 

zhaojjjjjj163
关注
vue-cli3打包上线时遇到的坑（打包后页面空白、接口404、进入二级页面刷新404）
qq_37021104的博客
12-20 1万+
前言: 刚开始以为打包上线挺简单的，不就是 cnpm run build打包然后把代码往服务器一扔吗。但是打包后发现遇到了各种问题，首先就是页面空白的问题，页面空白有两个原因，第一个是因为路径找不到造成的页面空白，第二个是渲染问题。其次就是后台接口404错误。在这里，我会建一个新的vue3项目，来重新走一遍打包时遇到的坑。 vue3打包上线后页面空白 vue3打包上线后调用后台接口...
Vite（三）部署静态站点（wordpress与hugo与Vercel、CI/CD、Travis CI、GitLab CI）、环境变量与模式、服务端渲染（SSR）
qq_43456781的博客
10-27 2387
Vite（三）部署静态站点（wordpress与hugo与Vercel、CI/CD、Travis CI、GitLab CI）、环境变量与模式、服务端渲染（SSR） 文章目录Vite（三）部署静态站点（wordpress与hugo与Vercel、CI/CD、Travis CI、GitLab CI）、环境变量与模式、服务端渲染（SSR）1. 部署静态站点构建应用本地测试应用GitHub PagesGitHub Pages 配合 Travis CIGitLab Pages 配合 GitLab CINetlifyG
vite-plugin-sri:一个Vite插件，可在构建时向您的index.html添加子资源完整性哈希
03-31
@ small-tech / vite-plugin-sri （SRI）插件。 在构建时，将子资源完整性哈希添加到从index.html文件导入的脚本和样式表中。 安装 npm i --save-dev @small-tech/vite-plugin-sri 采用 在您的vite.config.js文件中： import { defineConfig } from 'vite' import sri from '@small-tech/vite-plugin-sri' export default defineConfig ( { // … plugins : [ sri ( ) ] } ) 然后： npx vite build 测试与覆盖 运行npm test进行测试， npm run coverage以运行coverage。 也可以看看 如果您正在寻找一种可以完成相同
【Vite】修改构建后的 index.html 文件名
Superman_H的博客
07-10 1977
在 Vite 项目中，默认构建 `index.html` 。但有时候我们需要修改 `index.html` 为其他文件名，比如 `index-{时间戳}.html` 。 我们可以这样配置 vite.config.js： ```js import { defineConfig } from 'vite'; import type { PluginOption } from 'vite'; // 自定义插件 type RenameHtmlPlugin = () => PluginOption; cons
vue3 vite打包后动态修改打包后的请求路径，无需打多个包给后端
最新发布
m0_71835253的博客
04-27 584
vue3 vite打包后 部署多个服务器环境的时候，需要多次打包很麻烦，所以需要打包之后动态的修改
Vite - 配置 - 自动修改 index.html 中的title
northcastle的博客
11-20 8426
vite 通过配置文件的方式修改html的title
Vite打包后index.html空白
YJH15888673903的博客
01-13 1310
找到vite.config.js文件（没有就自己创建一个）里面加上 base: "./",然后用打开。
vue3+vite打包配置，绝对路径改相对路径，更改静态资源目录
热门推荐
vayne_1的博客
05-26 2万+
vue3+vite打包配置，绝对路径改相对路径，更改静态资源目录
vue-cli打包后本地运行dist文件中的index.html操作
10-14
标题和描述中提到的核心知识点是如何使用Vue CLI打包后的项目在本地环境中运行。Vue CLI是Vue.js的官方命令行工具，它简化了Vue.js项目的创建和开发过程。打包是开发周期中的一个关键步骤，通常是将源代码转换为生产...
修改方案，后端用spring boot。前端提供比较好的vue 并兼容脱离浏览器也可以使用方案
04-03
好的，我需要帮助用户将之前的Node.js后端迁移到Spring Boot，并且前端使用Vue，同时支持脱离浏览器运行。首先，我需要确保理解用户的需求。用户希望老板能够实时监测打卡人数，之前提供的方案是Node.js后端和Vue...
小白 thingsboard 拆分前后端分离
工控智联驿站
04-05 1172
javascript使用const关键字声明了一个常量，它是一个对象，用于存储多个代理规则。
放在vite项目的index.html里不对，放在直接的html里也不对，试试放在
weixin_40945354的博客
07-01 2112
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <link rel="icon" href="/favicon.ico" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Vite App&lt
解决Vue项目打包后dist中的index.html用浏览器直接打开显示空白页的问题
青春木鱼的博客
07-14 2万+
三种方案解决Vue项目打包后dist中的index.html用浏览器无法直接打开的问题
修改vue中的挂载页面（index.html）的路径
Vegas柠檬的博客
03-30 7403
vue中的挂载页面index.html路径是在webpack.dev.conf.js下配置的， 找到plugins下面的 new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', inject: true }), 以上便是挂载页面的配置，其中 filen...
vite+vue项目打包无需起服务，可直接访问html文件
02-16 703
当需要打包一个无需起服务，可直接访问对应index.html的页面时。当需要一个独立页面或者独立h5页面，但不想占用端口时。
解决vite打包后，index页面空白，静态资源引入路径错误
like_a_diamond的博客
01-04 3140
使用vite打包时，静态资源加载败，本文为图片路径的写法，保证项目在生产环境及开发环境正常显示
vue项目如何访问index.html,Vue——自定义项目访问路径
weixin_32679187的博客
06-17 6282
默认状况下，Vue项目的访问路径以 /#/，但咱们有时候可能须要给项目定义一个明确的访问路径，如 /my_vue/ 等，这时咱们须要修改配置，自定义项目的访问路径，方法以下：css1. 在index.html添加 (pay自定义的名称)收银台2. 在配置路由的index.js添加 mode: ‘history’, base: ‘/pay/’import Vue from 'vue'import ...
UNI+VITE(Vue3)如何自定义配置打包输出目录？UNI_OUTPUT_DIR？
weixin_43952913的博客
08-02 3385
UNI+VITE(Vue3)如何自定义配置打包输出目录
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值