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

最新推荐文章于 2024-05-15 00:37:59 发布
最新推荐文章于 2024-05-15 00:37:59 发布
阅读量1.4k 收藏 3
点赞数
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/snailmar/article/details/103544733
版权

好吧,看到搜索的人还比较多,提供一个官方简单的方法

npm install -g serve(全局安装)
serve -s dist(运行打包后的文件)

第二种方式

找到打包后的文件夹,即npm run build后生成的文件夹,一般没有配置的的话,默认是dist,找到dist中的index.html,使用vscode打开,此时要保证vscode安装了liveserver插件,只需要右键点击在liveserver中打开即可,注意如果使用了二级域名,需要修改对应的url地址

在这里插入图片描述

麻烦让一让，我比较宽
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
VsCode中ctrl+s后会在当前目录下自动生成dist目录的方法
10-14
主要介绍了VsCode中ctrl+s后会在当前目录下自动生成dist目录,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
使用webpack打包后的vue项目如何正确运行（express）
10-17
Vue 项目经过 Webpack 打包后，通常会生成一个 `dist` 文件夹，其中包含构建后的 HTML、CSS 和 JS 文件。但是，直接通过浏览器打开这个 HTML 文件可能会遇到问题，因为静态资源的引用路径可能由于跨域或文件系统访问...
运行vue打包的dist文件
小郑要做干饭人的博客
12-06 6543
npm install -g serve(全局安装) serve -s dist(运行打包后的文件) 若npm安装失败,请移步:node.js安装失败解决方法
Vue项目的打包方式（生成dist文件）
最新发布
2401_84152140的博客
05-15 462
自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！
webpack打包后的文件
weixin_30416871的博客
12-04 1213
用了webpack打包工具，你是不是有时会疑惑，写了一个很简单的函数，结果生成那么多东西，而且还没有问题？下面，我从三种情况来分析打包后的入口文件，帮助自己理解webpack打包，也为平时定位产出目录文件问题做准备。 参考vue脚手架的webpack配置，做一个项目后，会发现产出目录经常有app.js,vendor.js，manifest.js，*.js.gz，*.js.map生成。 因为...
vue配置生成打包文件dist
weixin_53571730的博客
04-21 656
Vue项目的打包方式（生成dist文件）_m0_54850604的博客-CSDN博客_vue项目打包成dist
webpack打包vue项目之后生成的dist文件本地运行
qq_37214137的博客
03-14 2964
本地测试打包文件
将前端dist文件打包成war包在tomcat里面部署
weixin_42694286的博客
05-06 2895
首先npm run build打包出dist文件夹。
详解webpack打包vue项目之后生成的dist文件该怎么启动运行
12-12
亲测，webpack打包vue项目之后生成的dist文件可以部署到 express 服务器上运行。 我的vue项目结构如下： 1. 进入该vue项目目录，打开git bash，执行：npm run build(在package.json的scripts配置) 执行成功如下...
浅谈在vue中用webpack打包之后运行文件的问题以及相关配置方法
08-28
在Vue中使用Webpack打包之后运行文件的问题及其相关配置方法 本文将详细介绍在Vue中使用Webpack打包之后运行文件的问题，以及相关的配置方法。通过对Webpack的配置文件进行修改，可以解决打包之后文件的运行问题，...
前端本地项目通过vscode插件自动部署dist文件到服务器
qq_31699161的博客
09-13 2187
1.在vscode应用商店中搜索拓展sftp插件，然后进行安装。 2.安装完成后重启窗口，按快捷键Ctrl+shift+p，输入sftp:config回车进入配置文件。 image.png 3.修改配置文件如下： { “host”: “120.0.0.1”, “port”: 21, “username”: “username”,//ftp用户名 “password”: “password”,//ftp密码 “protocol”: “ftp”, “agent”: null, “privateKeyPath”:
关于在vscode中使用npm对前端项目的打包处理问题
var_let_const的博客
06-10 2415
在vscode中，添加npm脚本扩展；其中有package.json里的build打包快捷键，点击后会生成一个dist文件，这个文件就是打包后的文件 或者配置过npm后，找到项目suo'z
【工具】一行命令就能开的前端静态服务器serve
向着光芒的女孩
06-21 5679
npm install -g serve # -s 参数的意思是将其架设在 Single-Page Application 模式下 # 这个模式会处理即将提到的路由问题 serve -s dist 优点：给来测dist服务器特别方便，发布前的测试，或者给产品测试验收，而你还需要开发环境的服务器敲代码时 参考： serve在的github文档: https://github.com/zeit/...
创建uniapp项目以及用VSCode运行在微信开发者工具
L_jin_c的博客
09-26 4053
创建uniapp项目
npm 包 - serve 使用
不会复制粘贴的程序员是一个好程序员。
05-08 1140
npm 包 - serve 使用
前端错误总结
qq_57919779的博客
11-24 2168
前端错误总结
怎么在本地电脑上运行vue项目打包出来的dist文件
zayyo的博客
07-27 2643
如何在本地运行我们的dist文件夹
vue-cli打包后本地查看起http-serve服务——基础积累
yehaocheng520的博客
05-10 1621
vue-cli打包后本地查看起http-serve服务
vscode 两种种不显示隐藏文件夹的方法
weixin_42829932的博客
01-02 2073
缺点是 不想上传，但是用的到的数据就看不见了，如csv文件。再添加.gitignore 内容（略）

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值