vue项目实现通过ip地址访问和localhost访问方式
更新时间：2022年09月05日 17:15:27 作者：codernmx
这篇文章主要介绍了vue项目实现通过ip地址访问和localhost访问方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
vue项目通过ip地址访问和localhost访问
为了实现vue项目启动服务，多个人可以查看，别人可以通过ip+端口访问
在config文件下的index.js文件中，修改host为：
host: '0.0.0.0'，
或者在package.json文件下"scripts"的"dev"后面加上–host 0.0.0.0"
例如：
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0",
重启服务可以看到通过localhost和IP地址都可以访问到这个服务。
vue项目中把localhost改成ip地址访问
vue2.0项目中 localhost改成ip地址访问
config/index.js改成
host: '0.0.0.0', port: 8888,
打包后index.html空白 修改
webpack.prod.conf.js 里的
publicPath:'./',
vue3项目改成ip地址访问
1.在项目的根目录下创建文件vue.config.js
2.在该文件中进行相关配置，从而覆盖默认配置
module.exports = {
outputDir:"course-analysis", //打包后的项目目录名称
publicPath: './',
devServer:{
host: '0.0.0.0',
port:8888
}
};以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
本篇文章主要介绍了Vue2 SSR 缓存 Api 数据，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-11-11
这篇文章主要介绍了让你30分钟快速掌握vue3，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-10-10
Vue.js是前端三大框架之一,以其轻巧、高性能的特性脱颖而出,Vue.js专注于构建数据驱动的Web界面,采用渐进式设计,易于上手,支持组件化开发,核心功能包括响应式数据绑定和视图组件的组合,Vue还提供了生命周期、事件绑定等多种功能,支持ES6语法2024-09-09
vue项目Network: unavailable的问题及解决
这篇文章主要介绍了vue项目Network: unavailable的问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-09-09
这篇文章主要给大家介绍关于前端Vue3父子组件传参有关sync修饰符的用法详细解析，有需要的朋友可以借鉴参考下，希望能够有所帮助2021-09-09
这篇文章主要介绍了vue实现路由切换改变title功能，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-05-05
在Vue中嵌入第三方页面可以采用多种方法,例如使用<iframe>、Vue插件、动态加载第三方脚本或WebComponents,不同方法适用于不同类型的内容和项目需求,如<iframe>适用于整个网页,而动态脚本和WebComponents适合特定功能,选择合适的方法可以有效整合外部资源2024-09-09
这篇文章主要介绍了如何使用Vite构建vue项目的相关资料,本文主要介绍了Vite构建Vue项目的详细步骤,包括检查node.js和pnpm的安装,构建Vite+Vue项目,利用HBuilderX导入项目,需要的朋友可以参考下2024-10-10
使用VUE+iView+.Net Core上传图片的方法示例
这篇文章主要介绍了使用VUE+iView+.Net Core上传图片的方法示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-01-01
在做单页面应用程序时，一般页面布局头尾两块都是固定在布局页面，中间为是路由入口。这篇文章主要介绍了vue-router 通过路由来实现切换头部标题 ,需要的朋友可以参考下2019-04-04
最新评论