Vue項目啟動后如何在瀏覽器自動打開
更新時間：2024年08月27日 10:35:37 作者：前端的小白
這篇文章主要介紹了Vue項目啟動后如何在瀏覽器自動打開問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
Vue項目啟動后在瀏覽器自動打開
想要實現(xiàn) Vue 項目在瀏覽器自動打開，只需要幾步簡單的操作就可以實現(xiàn)了。
我這里是使用了Vue3.x的腳手架創(chuàng)建的項目，項目的目錄架構(gòu)你們有可能是和你們的不太一樣，但是道理是這樣子的道理。
其他話不多說，直接上步驟安排。
1.找到Vue項目的package.json文件
"scripts": {
"serve": "vue-cli-service serve --open",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},在 scripts 代碼塊的 server 的后面加上 --open ，然后重新啟動項目。
做到這里的時候其實有些人的項目是可以直接在瀏覽器啟動的，但是我的不可以的，會遇到無法訪問網(wǎng)站的問題。
后來我又找了一下，是還需要配置第二步的 。
2.找到vue.config.js文件
沒有這個文件的話要自己創(chuàng)建一個，然后在里面加上如下的代碼段
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
devServer:{ //用于開發(fā)環(huán)境
host: 'localhost',
port: 8080,
}
})然后重新啟動項目，就可以在瀏覽器自動打開了。兄弟們，是不是挺簡單的。
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
文章介紹了使用JavaScript判斷圖片和PDF是否可以預(yù)覽的方法,對于圖片,通過創(chuàng)建Image對象并監(jiān)聽其load和error事件來判斷；對于PDF,則通過發(fā)送HTTP請求并檢查響應(yīng)類型為blob來判斷,需要的朋友可以參考下2026-04-04
前端如何調(diào)用Go語言后端接口(HTML?+?JS?&?Vue)
這篇文章主要介紹了前端如何調(diào)用Go語言后端接口(HTML?+?JS?&?Vue)的相關(guān)資料,文中通過代碼還討論了跨域問題的解決方法,并對比了HTML+JS和Vue的不同適用場景,需要的朋友可以參考下2026-01-01
vue實現(xiàn)修改標(biāo)簽中的內(nèi)容:id class style
這篇文章主要介紹了vue實現(xiàn)修改標(biāo)簽中的內(nèi)容：id class style，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-07-07
文章介紹了vue中向子組件傳值并允許修改的機制,通過defineModel實現(xiàn)雙向綁定,它返回一個ref,并且可以配置底層prop的選項,本文結(jié)合實例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2025-01-01
當(dāng)你跑起一個項目的時候,第一步需要先安裝依賴npm install,下面這篇文章主要給大家介紹了關(guān)于npm?install安裝報錯的幾種常見情況,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-07-07
vue路由傳參-如何使用encodeURI加密參數(shù)
這篇文章主要介紹了vue路由傳參-如何使用encodeURI加密參數(shù)，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
Vue表單組件進(jìn)階之如何打造屬于你的自定義v-model
在Vue中自定義組件是一個強大的功能,它允許你將可重用的代碼封裝成獨立的模塊,從而提高開發(fā)效率和代碼的可維護性,這篇文章主要介紹了Vue表單組件進(jìn)階之如何打造屬于你的自定義v-model的相關(guān)資料,需要的朋友可以參考下2025-11-11
這篇文章主要介紹了vue操作dom并為dom增加點擊事件方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-04-04
本文主要介紹Vue.js中過濾器和自定義指令相關(guān)的知識點，包括過濾器的定義方式，和使用方法，以及自定義指令的概念和注冊方式。2021-05-05
這篇文章主要介紹了Vue?全部生命周期組件梳理整理，在創(chuàng)建組件之前使用；在實例初始化之后,進(jìn)行數(shù)據(jù)偵聽和事件，偵聽器的配置之前同步調(diào)用2022-06-06