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