vue項目如何讓局域網(wǎng)ip訪問配置設(shè)置
更新時間：2022年09月05日 12:02:53 作者：狂野小青年
這篇文章主要介紹了vue項目如何讓局域網(wǎng)ip訪問配置設(shè)置，具有很好的參考價值，希望對大家有所幫助。
vue讓局域網(wǎng)ip訪問配置設(shè)置
在開發(fā)中，為了讓同一局域網(wǎng)的小伙伴，都可以通過IP地址訪問到vue-cli搭建的項目，要怎么配置呢?
第一步：修改config文件中找到 index.js 文件的host改成 ‘0.0.0.0’
第二步：檢查 package.json 文件里進行配置，scripts.dev配置是否設(shè)置 host為‘0.0.0.0’
這里我要強調(diào)下，第一步和第二步都有ip，其實第二步優(yōu)先級高，這里第二步的host可以不設(shè)置，vue默認執(zhí)行第一步的設(shè)置。
這個ip也可以設(shè)置成你的局域網(wǎng)ip，例如：192.168.1.182
第三步：查看開發(fā)機的ip地址，并告訴給其他小伙伴，別忘了端口
第四步：如果通過IP還不能訪問，最好是關(guān)閉開發(fā)機的防火墻，如果你不怕麻煩也可添加放行端口
vue局域網(wǎng)使用ip無法訪問的解決
搜到了很多解決方法，但是，嘗試到這個才能用
版本：
[root@localhost vue_time]# vue --version
2.9.6[root@localhost vue_time]# node -v
v15.5.1
只要在項目的目錄下，找到package.json 在script模塊下，dev項中，增加一個啟動配置參數(shù) --host 0.0.0.0即可，下面是增加了之后的
[root@localhost vue_time]# cat package.json
{
"name": "vue_time",
"version": "1.0.0",
"description": "A Vue.js project",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --host 0.0.0.0 --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"unit": "jest --config test/unit/jest.conf.js --coverage",
"e2e": "node test/e2e/runner.js",
"test": "npm run unit && npm run e2e",
"lint": "eslint --ext .js,.vue src test/unit test/e2e/specs",
"build": "node build/build.js"
},以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了使用vue實現(xiàn)HTML頁面生成圖片的相關(guān)知識，本文通過實例代碼給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-03
對Vue2 自定義全局指令Vue.directive和指令的生命周期介紹
今天小編就為大家分享一篇對Vue2 自定義全局指令Vue.directive和指令的生命周期介紹，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了詳解Vue 動態(tài)組件與全局事件綁定總結(jié)，從示例中發(fā)現(xiàn)并解決問題，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
今天小編就為大家分享一篇在vue中v-bind使用三目運算符綁定class的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
解決Vue使用百度地圖BMapGL內(nèi)存泄漏問題?Out?of?Memory
這篇文章主要介紹了解決Vue使用百度地圖BMapGL內(nèi)存泄漏問題?Out?of?Memory，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-12-12
vue-virtual-scroller是一個高度可定制的虛擬滾動列表插件，它可以在大量數(shù)據(jù)下提供高性能的渲染和滾動，這篇文章主要介紹了vue-virtual-scroller 的使用,需要的朋友可以參考下2023-07-07
這篇文章主要介紹了Vue如何根據(jù)角色獲取菜單動態(tài)添加路由,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧2024-01-01
這篇文章主要為大家介紹了vue頁面狀態(tài)持久化，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-12-12
這篇文章主要為大家詳細介紹了vue自定義可選時間的日歷組件，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
vue后臺系統(tǒng)管理項目之角色權(quán)限分配管理功能(示例詳解)
這篇文章主要介紹了vue后臺系統(tǒng)管理項目-角色權(quán)限分配管理功能,本文通過實例代碼給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-09-09