vue 项目build之后本地直接打开index访问（打包到app中）

最新推荐文章于 2024-07-26 15:23:12 发布
最新推荐文章于 2024-07-26 15:23:12 发布
阅读量9.5k 收藏 2
点赞数 2
文章标签： vue打包 build vue本地访问
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cao185493676/article/details/81218126
版权

1.打开项目文件夹。找到config文件夹里的index.js文件中的build对象，将assetsPublicPath中的“/”，改为“./”。

2.router文件下面的index.js路由配置文件不要配置mode: "history"（不用配置这个属性）

Android你好安卓
关注
Vue3 - 完美解决 vite 打包后在本地浏览器直接打开运行，build 打包后双击 index.html 直接以 file 协议运行网站（资源、接口等正常访问，和部署到服务器运行效果一样）
王佳斌
09-07 1万+
vue3 vite怎么支持file协议本地打开，vite打包文件如何支持files协议,支持双击即可打开网页，vue3 vite打包后双击本地运行，vue3 vite打包后怎么直接在浏览器双击打开访问，vite打包后显示空白，vite如何支持本地file协议打开，vue3 vite打包后如何本地查看网站，vue3 vite项目打包后本地启动白屏怎么办，vite打包后的代码如何在本地运行，vite+vue3 打包在fIle本地index.html打开项目，打包后如何直接打开index.html文件，vue3
vue打包后直接本地访问index.html
小白白的博客
12-20 1204
在vue.config.js 文件，没有的话就新建一个，并添加publicPath: './ ’router.js 把mode改成。
vite项目，编译后，直接自动打开的配制方法
最新发布
花花鱼的专栏
07-26 329
vite项目编译后，直接自动打开，增加open:true就可以实现。
vue项目直接打开dist文件夹下面的index.html文件
Zxiuping的博客
08-06 3344
关于vue项目直接点击dist文件夹下面的index.html文件使项目在浏览器显示，需配置两个文件， config/index.js build: { assetsPublicPath: './', } build/utils.js function generateLoaders (loader, loaderOptions) { const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssL
Vue——vue项目打包完点击index.html打开
qq_45997679的博客
04-03 3685
在Vue项目打包完之后会出现：Tip: built files are meant to be served over an HTTP server. Opening index.html over file:// won't work. 1、用http-server解决。 在本地安装一个简易的http服务器。 npm install http-server -g 然后在打包好的dist包中运行：hs 2、修改项目配置，因为vue-cli的默认配置中, publishPath是用绝对目录, 所以dist
vue build之后，可以在本地浏览使用
孤月葬花魂的博客
04-23 346
vue build之后，可以在本地浏览使用 本地无法浏览的根本原因，是build之后，文件的引入路径错误导致的，只需要在build时修改路径即可 // vue.config.js, 如果没有本文件，请在根目录创建 module.exports = { publicPath: process.env.NODE_ENV === 'production'? './' : '/', outputDir: 'dist', // build 时生成的生产环境构建文件的目录（默认） assetsDir: 's
vue项目部署到github并生成可访问地址
xx_ll_的博客
05-01 696
vue项目部署到github并生成可访问地址先在github上面创建自己的仓库上传本地项目代码到远程仓库生成github page地址 先在github上面创建自己的仓库 整个创建步骤如下： 1、选择到自己的仓库页面下 2、点击按钮新建仓库 3、创建仓库步骤如下 4、创建完成后页面如下： 上传本地项目代码到远程仓库 1、自己要先安装好git，可以去官网上面根据安装步骤安装好 2、在要上传代码的本地项目文件中，鼠标右键点击Git Bash Hhere 3、执行 git init 命令 ，文件中会生成一
vue项目打包为APP,静态资源正常显示,但API请求不到数据的操作
10-14
在Vue项目中，将应用打包成APP涉及到一系列的配置和步骤。当静态资源能够正常显示，但API请求无法获取数据时，通常问题出在跨域配置和打包设置上。以下是一些关键知识点和解决方法： 1. **跨域问题**： 在开发环境...
vue移动端项目打包成app
01-08
这几天 我做了一个vue移动端的小项目 就想着打包成 app安装在手机上看看 我就讲解下整个思路和过程 首先项目开发完之后 （我使用的是vue-cli 3.*版本） 在项目文件夹下创建一个 vue.config.js module.exports ...
vue编译打包本地查看index文件的方法
08-27
在Vue.js开发过程中，我们经常需要将项目编译打包，以便于部署到生产环境或者预览本地构建结果。本文将详细介绍如何在Vue编译打包后，本地查看`index.html`文件，以及`/build/config/index.js`配置文件中的`...
解决vue build打包之后首页白屏的问题
08-27
在开发Vue.js应用时，我们通常会使用`npm run build`命令将项目打包为生产环境版本。然而，有时候在执行这个命令后，发现打包后的应用在浏览器中打开时会出现首页白屏的情况。这个问题可能由多种原因引起，但最常见...
vue本地打开build后生成的dist文件夹index.html问题
10-16
主要介绍了vue本地打开build后生成的dist文件夹index.html问题，本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧
Vue 打包的静态文件不能直接运行的原因及解决办法
01-22
然而在使用 npm run build 打包项目时，却发现打包好的项目在浏览器中直接打开好像什么都没有？ 原因 查看了一下打包后的 index.html 源码，终于发现了一个重要的点： 所有涉及到路径的地方全都是以 / 开头的 下面...
vue项目build 打包之后如何本地访问
qq_44776454的博客
06-18 1035
Vue项目构建后实现本地访问的方法
vue项目如何访问index.html,vue项目中，main.js,App.vue,index.html如何调用
weixin_36154762的博客
06-17 1532
Linux_修改创建文件夹时默认权限(修改为能上传)1:查看当前权限 umask 0022 意思就是权限为:777-022 =755 读 2:临时修改 umask 020 020 意思为:777-020=757 读写上传 3:永久修改 回到根目录 cd ...CRM客户关系管理系统(二)第三章.前端页面设计 3.1.前端页面布局 Bootstrap模板下载 (1)静态文件 ...
vue项目npm run build 打包之后如何在本地访问
骨子里的偏爱
04-26 1398
vue项目npm run build 打包之后如何在本地访问
vue中的uri_vue部署后，访问路径问题
weixin_36373381的博客
12-29 1578
今天刚回答了一个类似的问题，我就直接把答案粘贴过来了！单页面应用应该放到nginx或者apache、tomcat等web代理服务器中，同时要根据自己服务器的项目路径更改vue的路由地址。如果说项目是直接跟在域名后面的，比如:http://www.sosout.com，根路由就是 '/'。如果说项目是直接跟在域名后面的一个子目录中的，比如:http://www.sosout.com/childre...
vue 使用了浏览器的刷新之后报错_Vue项目部署到tomcat，配置了404页面转到index.html，但是刷新页面后浏览器地址栏变为index.html...
weixin_39955149的博客
12-20 609
问题描述我的Vue项目需要部署到tomcat下，放在webapps下的一个名为mapedu的文件夹内，在VueRoute中所有的路由都加了mapedu前缀。也配置了/webapps/mapedu/WEB-INF/web.xml文件如下<?xml version="1.0" encoding="UTF-8"?><web-app xmlns="http://xmlns.jcp.org...
vue打包本地启动方案
qq_28875189的博客
05-23 864
在本地启动Vue打包的方案有很多种。
Vue项目使用HBuilder打包成APP详细教程
运行`npm run build`命令，Vue CLI会将项目打包到`dist`目录下，生成用于发布的静态文件。 4. **创建新目录**： 在HBuilder中，打开`dist`目录，并创建一个新的目录，例如命名为`MyApp`，将打包后的文件移动到这...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值