Vue3?跨域配置devServer的參數(shù)和設置方法
devServer
是一個用于配置開發(fā)服務器的選項對象。它可以用來配置服務器的各種選項,例如代理,端口號,HTTPS 等。
以下是一些常用的 devServer
參數(shù)和設置:
port
:指定開發(fā)服務器的端口號,默認為8080
。host
:指定開發(fā)服務器的主機名,默認為localhost
。https
:開啟 HTTPS,可以傳入一個Object
類型的參數(shù),用于配置 HTTPS 選項。open
:自動打開瀏覽器,默認為false
。可以傳入一個String
類型的參數(shù),用于指定瀏覽器的名稱。proxy
:用于配置代理??梢詡魅胍粋€Object
類型的參數(shù),用于配置代理選項。hot
:啟用熱重載,默認為true
。compress
:啟用 gzip 壓縮。historyApiFallback
:啟用 HTML5 歷史模式路由。當瀏覽器訪問的路徑不存在時,將返回index.html
文件,而不是 404 頁面。publicPath
:指定資源的公共路徑,可以是一個相對路徑或絕對路徑。quiet
:禁用所有輸出信息。clientLogLevel
:指定在瀏覽器控制臺中顯示的日志級別,默認為info
。overlay
:在瀏覽器中顯示編譯錯誤。watchOptions
:用于配置監(jiān)視文件的選項。contentBase
:指定靜態(tài)文件的目錄,默認為項目根目錄。before
和after
:在服務器啟動之前或之后執(zhí)行自定義代碼。
下面是一個 devServer
的配置示例:
// vue.config.js module.exports = { devServer: { port: 8080, host: 'localhost', https: false, open: true, proxy: { '/api': { target: 'http://localhost:3000', changeOrigin: true } }, hot: true, compress: true, historyApiFallback: true, publicPath: '/', quiet: true, clientLogLevel: 'warning', overlay: true, watchOptions: { poll: false }, contentBase: './public', before: function(app) { // 在服務器啟動之前執(zhí)行自定義代碼 }, after: function(app) { // 在服務器啟動之后執(zhí)行自定義代碼 } } };
在這個示例中,我們做了以下配置:
- 將開發(fā)服務器的端口號設置為
8080
。 - 將開發(fā)服務器的主機名設置為
localhost
。 - 禁用 HTTPS。
- 自動打開瀏覽器。
- 配置代理,將所有以
/api
開頭的請求代理到http://localhost:3000
。 - 啟用熱重載。
- 啟用 gzip 壓縮。
- 啟用 HTML5 歷史模式路由。
- 指定資源的公共路徑為根目錄。
- 禁用所有輸出信息。
- 將日志級別設置為
warning
。 - 在瀏覽器中顯示編譯錯誤。
- 監(jiān)視文件的選項設置為默認值。
- 指定靜態(tài)文件的目錄為
./public
。 - 在服務器啟動之前和之后執(zhí)行自定義代碼。
您可以根據(jù)自己的需求來配置 devServer
。這個示例僅僅是一個起點,您可以根據(jù)自己的需求進行修改和擴展。
到此這篇關于Vue3 跨域配置devServer的參數(shù)和設置的文章就介紹到這了,更多相關Vue3 跨域配置內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
vue關于select組件綁定的值為數(shù)字類型的問題
這篇文章主要介紹了vue關于select組件綁定的值為數(shù)字類型的問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-09-09Vue.js 的移動端組件庫mint-ui實現(xiàn)無限滾動加載更多的方法
下面小編就為大家分享一篇Vue.js 的移動端組件庫mint-ui實現(xiàn)無限滾動加載更多的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2017-12-12vue2.0 + ele的循環(huán)表單及驗證字段方法
今天小編就為大家分享一篇vue2.0 + ele的循環(huán)表單及驗證字段方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09Vue實現(xiàn)右鍵菜單組件的超詳細教程(支持快捷鍵)
右鍵菜單組件非常常見,所有的前端開發(fā)工程師都會遇到類似的功能組件開發(fā)需求,這篇文章主要給大家介紹了關于Vue實現(xiàn)右鍵菜單組件的超詳細教程,文中介紹的方法支持快捷鍵,需要的朋友可以參考下2024-02-02