vue创建dist 直接访问index.html方法

已于 2022-04-12 10:17:49 修改
阅读量3k 收藏 4
点赞数 3
分类专栏： VUE 文章标签： vue
于 2022-04-12 10:15:09 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_26651573/article/details/124116726
版权

vue项目中直接访问index.html方法


npm run build
会在项目中生成dist文件 其中index.html 等于一个vue项目

在项目中找到 config文件 需要配置index.js

在项目中找到 config文件 需要配置index.js
就可以实现用index.html文件访问网站在这里插入图片描述

亲测不需要变动的地方

如果端口占用，需要改端口，可以改port
访问的地址需要改动可以改host
在这里插入图片描述
改动后的端口和本地地址访问例如：
在这里插入图片描述

不知道曲啥名
关注
  • 3
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue-cli打包后本地运行dist文件中的index.html操作
10-14
主要介绍了vue-cli打包后本地运行dist文件中的index.html操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
前端打包生成的dist文件，index.html直接访问
m0_52539506的博客
09-26 2406
前端打包dist文件，直接访问index.html
Vue中通过Vue.extend动态创建实例的方法
12-09
在Vue中，如果我们想要动态地来控制一个组件的显示和隐藏，比如通过点击按钮显示一个对话框或者弹出一条信息。我们通常会提前写好这个组件，然后通过v-if = “show”来控制它的显示隐藏。如下所示： <div> <button @click = "show = !show">弹出</button> <span xss=removed>这是一条通过按钮控制显示隐藏的信息</span> </div> 另外还有一种实现方法就是通过Vue.extend来动态地创建实例，在想要进行显示的时候创建实例。  在需要隐藏的时候删除这个实例。 1.通过Vue.extend创建构造
vue 打包完自己本地能够直接打开index.html
qcg14774125的博客
04-14 6150
第一步修改config里面的index.js 把 assetsPublicPath：'/' 修改成 assetsPublicPath='./' 第二步修改build里面的util.js if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, pub...
nodejs访问本地静态资源（进入index.html）
tabweb的博客
06-13 9781
最近用nodejs搭建服务，需要直接访问本地的index.html文件。让别的电脑通过输入IP：/index.html访问 在网上也找到了代码，顺便做个笔记 代码 var url = require("url"), fs=require("fs"), http=require("http"), path = require("path"); http.c...
index html忘记写入,index.html 忘记写入循环条件了吧。，再试试！直接进入下一节,各位大神 这是什么情况？...
weixin_32820101的博客
06-04 496
if...elsevar czz,vzz=0;//czz变量存放不同面值，vzz总计for(czz=1;czz<=10;czz++){vzz= vzz + czz;}for(czz=2;czz<=10;czz++){vzz=vzz+czz;}for(czz=3;czz<=10;czz++){vzz=vzz+czz;}for(czz=4;czz<=10;czz++){vzz=...
vue项目中，把已经写好的html直接放进去，而不经过编译，直接跳转html页面
m0_67841039的博客
09-07 3465
2.如果项目根目录没有public,但是有static文件夹，则同样把/pages/test.html放进 static文件夹里，按照static的绝对路径访问。1.项目根目录里，如果有public文件夹，则直接放进public文件夹里，与index.html 同级开始，按照项目路径访问。
解决Vue项目打包后dist中的index.html用浏览器直接打开显示空白页的问题
热门推荐
青春木鱼的博客
07-14 1万+
三种方案解决Vue项目打包后dist中的index.html用浏览器无法直接打开的问题
三种方案解决Vue项目打包后dist中的index.html用浏览器无法直接打开的问题
m0_66051368的博客
07-06 4734
Vue打包后生成的dist文件中的index.html，双击在浏览器中打开后发现一片空白，打开控制台有很多报错：“Failed to load resource: net::ERR_FILE_NOT_FOUND”。2. 将index.html中资源引用的绝对路径改为相对路径；这是因为dist文件是需要放在服务器上运行的，资源默认放在根目录下。可以打开浏览器在localhost:8080中查看了。，此时可以双击index.html在浏览器中正常访问了！指向磁盘根目录，所以找不到引用的文件。
小而美博客笔记-1.登录用户
开心
02-15 562
1.做登录页面login.html，登录成功后台首页index.html 2.UserService（业务逻辑层）和UserReporsitory（DAO层） 3.（控制器层）LoginController实现登录 4.MD5加密 5.登录拦截器 1.登录页面login.html resources/templates/admin/login.html 建立一个form表单，post方式提交请求 2.登录成功后进入后台首页index.html 3.dao包 接口UserReporsi
vue本地打开build后生成的dist文件夹index.html问题
10-16
主要介绍了vue本地打开build后生成的dist文件夹index.html问题，本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧
vue项目中,main.js,App.vue,index.html的调用方法
10-17
今天小编就为大家分享一篇vue项目中,main.js,App.vue,index.html的调用方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
01-19
Vue项目运行npm run build后会生成一个dist文件夹，我们一般都是把这个文件夹部署到服务器上。dist文件夹里边有一个static文件和一个index.html页面，这个index就是最后单页面的最终文件。 问题一：我在打包完成后，...
vue在index.html中引入静态文件不生效问题及解决方法
10-17
主要介绍了vue在index.html中引入静态文件不生效问题及解决方法，本文给大家分享两种原因分析，通过实例代码讲解的非常详细 ,需要的朋友可以参考下
vue-cli 3.x 修改dist路径的方法
12-11
一些牢骚 前端的世界真的太奇妙，更新速度真的跟火箭一样。...最近在一个项目中，将vue-cli更新到了最新版的3.x。同时webpack也更新到了4.x。webpack4在一些配置上有了很大一部分的精简。据说是受到了最近
vue项目如何访问index.html,Vue——自定义项目访问路径
weixin_32679187的博客
06-17 5821
默认状况下，Vue项目的访问路径以 /#/，但咱们有时候可能须要给项目定义一个明确的访问路径，如 /my_vue/ 等，这时咱们须要修改配置，自定义项目的访问路径，方法以下：css1. 在index.html添加 (pay自定义的名称)收银台2. 在配置路由的index.js添加 mode: ‘history’, base: ‘/pay/’import Vue from 'vue'import ...
vue 项目build之后本地直接打开index访问（打包到app中）
嘿，你的益达。
07-26 9504
1.打开项目文件夹。找到config文件夹里的index.js文件中的build对象，将assetsPublicPath中的“/”，改为“./”。 2.router文件下面的index.js路由配置文件不要配置mode: "history"（不用配置这个属性）...
解决Vue3项目打包后dist中的index.htm无法用浏览器直接打开
普通人一枚
12-09 2007
创建一个服务器来访问资源（最简单了，不过要有环境，普通电脑还是不行，其他方式参考其他帖子）：可以打开浏览器在localhost:8080中查看了，访问成功！
vue打包后的项目怎么直接访问index.html
最新发布
02-01
要直接访问index.html，可以通过以下步骤进行： 1. 将打包后的dist文件夹部署到一个web服务器中，如Apache、Nginx等，确保服务器已经安装并配置完成。 2. 在服务器的根目录下创建一个文件夹，例如"myproject"，将...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值