Vue打包好的dist如何在本地运行

墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 1.2k累计阅读 1.2k平均单平台已同步平台优快云微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网我也要 → 码龄8年

关注

原创最新推荐文章于 2025-07-28 14:43:24 发布 1.2k 阅读 AI 写同款· GEO 优化 ›

vue-cli3.0项目打包后修改访问后端地址问题：原本是将访问后台的地址卸载代码里面，但是这样的话打包之后就不能修改了，只能在代码里面修改，然后重新打包解决：在vue3.0之前的版本，项目目录有static不会被打包，而在vue3.0项目目录没有static文件夹，但是有public文件夹是不会被打包，所以在public目录下创建一个js文件，命名为config.js 在里面添加代码，定义BASE_URL为要访问后台接口的... 阅读详情

1、打开终端使用npm安装http-server

全局加 -g

npm i -g http-server

2、指定端口和地址（dist目录下运行）

http-server -p 9999 -a 127.0.0.123

-p或–port要使用的端口（默认为8080）
-a 要使用的地址（默认为0.0.0.0）

收录于

当前文章被以下社区和专栏收录：

标签

#vue.js #前端 #javascript

vue笔记1：创建项目，打包本地运行dist，vue cli gitee pages部署运行404坑打包本地运行dist 官方文档中的本地预览: dist 目录需要启动一个 HTTP 服务器来访问 (除非你已经将 publicPath 配置为了一个相对的值)，所以以 file:// 协议直接打开 dist/index.html 是不会工作的。在本地预览生产环境构建最简单的方式就是使用一个 Node.js 静态文件服务器，例如 serve： cnpm install -g serve # -s 参数的意思是将其架设在 Single-Page Application 模式下 # 这个模式会处理即将提到的路由问阅读详情

相关推荐

本地测试vue-cli打包后的dist文件

此方法可以自己本地写接口，自己打包vue-cli，然后测试打包后的文件是否正确。 1.本地获取自己写到的node.js接口可能会遇到跨域的问题，可以看我的博客跨域问题 1.1.在vue页面中引入自己node.js写的接口（关于node.js的教程可以看我以前的博客） <template> <div class="hello"> <h1&g...

小毛驴的博客 1万+

vue打包后dist文件在本地启动运行

vue项目开发好后，想在本地运行测试最后的打包文件可以通过http-server来启动。最后在浏览器输入：127.0.0.1:9007就可以查看了。

qq_38902432的博客 5613

vasp算表面吸附流程_VASP表面吸附计算实例分析

本文主要为了记录在学习Vasp计算过程中如何设置INCAR中的一些参数，并不着重讲解其含义，详见可自行到vasp官网查阅。其次关于建模部分也不做细致讨论，一般结构可从Materials Studio里自带的晶体数据库导出，或从三大数据库网站上下载:1、Materaials Project网址：https://materialsproject.org/(强烈推荐，邮箱注册即可使用)2、CCDC网址：...

weixin_39617669的博客 2240

如何运行vue打包之后的dist文件

介绍一种使用Node.js中的http-server模块搭建本地服务器的方法：1.确认已经安装了Node.js；2.安装http-server模块；3.进入到dist目录；4.启动http-server；5.输入网址，访问项目文件。

CLOUDS06的博客 1万+

C#菜鸟教程学习笔记

C#菜鸟教程学习笔记 C#简介 C# 是一种编程语言，它是由微软开发的。 C# 编程是基于 C 和 C++ 编程语言的，它与 Java 也非常相似。 C# 是 .Net 框架的一部分，且用于编写 .Net 应用程序。 .Net 框架（.Net Framework）能编写出下面类型的应用程序： ①Windows 应用程序 ②Web 应用程序 ③Web 服务常用的C# 编程的开发工具：Visual Studio(VS:可视化工作室) C#程序结构一个 C# 程序（C# 文件的后缀为 .cs）主要包括以下部分

mlc_WTMOTW的博客 4975

【网络安全】零基础入门网络安全劝退指北

作为从16年接触网络安全的小白，谈谈零基础如何入门网络安全，有不对的地方，请多多指教。这些年最后悔的事情莫过于没有把自己学习的东西积累下来形成一个知识体系。后续我也会陆续的整理网络安全的相关学习资料及文章，与大家一起探讨学习。如何入门简单了解网络安全网络安全就是指的确保网络系统中的数据不被别人破坏，而网安工程师就是涉及程序来维护网络安全。网安方向有很多职位，比如安全产品工程师，安全分析师，数据恢复工程师，网络架构工程师，安全编程工程师，以及网络集成工程师等。工作内容主要包括：安全评测，风

互联网老辛 4583

本地运行打包好的dist

首先输入打包命令每个人设置不一样一般人是。

qq_41739657的博客 1892

YOLOv9电力巡检实战：绝缘子破裂/鸟巢识别+无人机自动定位

摘要：本文聚焦电力输电线路巡检的效率与安全痛点，提出基于YOLOv9与无人机的智能巡检解决方案。针对绝缘子破裂、鸟巢等高危缺陷，通过“无人机改装-模型训练-缺陷识别-工单生成”四阶段工程落地流程，实现全自动化巡检。系统采用大疆M300无人机搭载RTK模块与Jetson边缘计算盒，结合改进YOLOv9模型实时识别5类缺陷，通过4G传输将GPS定位与缺陷数据同步至工单系统。实测表明，该方案巡检效率达50公里/天（较人工提升10倍），缺陷发现率95%（提升40%），事故预防率98%。

专注于人工智能、软件开发、工控自动化、工厂数字化及智能化等领域，希望和大家共同进步！ 1509

前端打包运行dist的三种方法

前端运动部署dist的三种方法总结

missCheney的博客 4478

课堂练习及课后作业2.1：外部中断

本关任务：通过相关知识以及实验回答：版本 1 内核的第 6 次时钟中断发生时，断点和恢复点（指令地址）分别是多少？本关任务：修改版本 0 内核，使得每发生 100 次时钟中断，就在屏幕上输出一个字符‘t’和当时的进程号，如“t(0)”表示0号进程运行时发生了时钟中断。本关任务：通过实际操作回答在输出第一行 0/1 字符的过程中（如下图所示），共发生了几次时钟中断？本关任务：修改版本 1 内核源码，使得每次时钟中断发生时，都在屏幕上输出字符‘t’。分析版本1内核，找到第一次时钟中断的恢复点地址。

Junds0的博客 1万+

课程1：认识Asp.net Core Web API

本文是《.Net Core从零学习搭建权限管理系统》教程专栏的导航站（点击链接，跳转到专栏主页，欢迎订阅，持续更新…）专栏介绍：以实战为线索，基于.Net 7 + REST + Vue、前后端分离，不依赖任何第三方框架，从零一步一步讲解权限管理系统搭建。专栏适用于人群：Web后端开发人员Web API是一个很广泛的概念，Asp.net Core Web API是.NET框架用于创建RESTful风格的项目、用于轻松构建可供多个客户端访问的HTTP服务。1、支持RestFul风格编程；

成长的足迹 1255

本地运行vue dist文件

vue打包命令 npm run build 运行这个命令会在目录中生成一个dist文件夹在服务器部署vue项目只需要把这个文件夹给后台就可以了但是打包之后我们需要在本地先自测一下，下面就是踩过的一些坑：静态资源路径问题——空白页面解决方法：打开脚手架的config文件中的index.js文件，把build对象内的assetsPublicPath(发布路径)改为"./"。默认的情况下是...

韩大璐 1万+

13、7自由度机械臂混合逆运动学算法解析

本文介绍了一种针对7自由度机械臂的混合逆运动学算法，通过引入额外参数Φ解决冗余自由度问题，并实现了避障、避免关节超限和扩大工作空间。该方法采用解析逆运动学求解策略，克服了机械臂在奇异位姿时的配置不连续性问题。通过对比实验验证了该算法在腕部关节角度连续性和位姿可达性方面的优越性，同时结合躯干逆运动学显著扩展了机械臂的工作空间。

rgv23456789的博客 236

vue项目打包之后怎么在本地运行

vue项目打包后的文件需要在本地运行，这里介绍两种方法（一）搭建express本地服务器 1、安装express-generator npm i express-generator -g 2、创建一个express项目 express my-express-project 3、进入项目目录 cd my-express-project 这时候能看到my-express...

萧萧的博客 2万+

怀旧版电脑GBC模拟器

再现原版GBC掌机的界面，电脑运行连游戏界面都一样大小，很怀旧，很真实，（英文版）强烈推荐，很小的文件，很难才找到的。

锂电池充电器电路设计里面有电路

锂电池充电器电路设计里面有电路 3.7V升压到5V电路设计。

【vue项目本地打包测试，本地运行dist文件夹】

vue项目打包：npm run build //或者 # 构建测试环境 npm run build:stage # 构建生产环境 npm run build:prod 本地虚拟服务依赖下载：npm install http-server -g 在对应生成的打包文件夹dist文件夹运行命令 http-server 复制地址到浏览器就可以啦~

General_D的博客 3881

efm32 入门.pdf

本PDF共计22页，介绍的是操作驱动API，下载与否自己斟酌。

webpack打包vue项目之后生成的dist文件该怎么启动运行

亲测，webpack打包vue项目之后生成的dist文件可以部署到 express 服务器上运行。我的vue项目结构如下：1. 进入该vue项目目录，打开git bash，执行：npm run build(在package.json的scripts配置)执行成功如下图所示：然后此时你会发现项目下多了一个 dist 文件夹，dist下文件便是项目打包之后生成的文件。此时我们直接在浏览器中打开inde...

u014054437的博客 10万+

假人有限元模型

假人模型，车辆碰撞假人有限元模型，适合做乘员安全的研究者利用

vue3项目打包后，将dist文件在本地运行

vue3项目开发好后，打包完成，想在本地运行测试打包文件可以通过http-server来启动。2、打包完成后，进入dist打包文件。4、启动dist文件，并指定端口。3、安装http-server。

weixin_66582617的博客 2803

如何运行webpack打包的vue项目之后的dist文件

1、打包vue项目：npm run build会生成一个dist文件 express是一个基于node.js平台的web开发框架 2、安装express、express-generator npm install express -g npm i express-generator -g 3、创建expressDemo项目 express exp...

qq_35165469的博客 3293

怎么在本地电脑上运行vue项目打包出来的dist文件

如何在本地运行我们的dist文件夹

zayyo的博客 3595

vue项目打包成dist后，如何部署到本地呢

关于webPack打包后本地启动服务器查看除了启动apache的方式启动本地服务器，这里介绍一种快捷方式 1.安装http-server 启动mac终端，全局安装： # sudo cnpm install -g http-server 2. 进入dist产出目录 # cd dist 3.开启服务 #hs 运行成功后，访...

tomotoCoder的博客 2958

vue打包后的dist包在本地运行

Q: vue打包后的 dist 包怎么在本地运行？

qq_37150922的博客 966

使用node搭建服务器，前端自己写接口，将vue或react打包后生成的dist目录在本地运行

使用node搭建服务器，前端自己写接口，将vue或react打包后生成的dist目录在本地运行。vue项目打包后生成的dist目录如果直接在本地打开index.html,在浏览器中会报错，无法运行起来。通常我是放到后端搭建的服务上面去运行，当时前端自己也可以是node，nuxt搭建服务器，写接口等等如果想在本地运行，我们可以借助node.js+express搭建一个服务器，将打包后的文件部署在服务器上，就可以运行起来了。