首頁 web前端 js教程 在Webpack中解決熱部署偵測不到檔案變更的問題

在Webpack中解決熱部署偵測不到檔案變更的問題

Jun 05, 2018 pm 03:09 PM
webpack 熱部署

下面我就為大家分享一篇解決Webpack 熱部署偵測不到檔案變更的問題,具有很好的參考價值,希望對大家有幫助。

今天在用Webpack開發的時候,突然發現檔案變動後熱部署功能不工作了,感覺好像是webpack偵測不到檔案的修改了。折騰了半天,開始一直以為是自己的程式碼有問題了,結果一次無意識的重啟了一下機器後發現又可以熱部署了,感覺像是見鬼了。於是繼續觀察。

一天后,不幸再次降臨,問題又出現了。

研究了一下,原來Webpack 的熱部署功能是使用inotify 來監視檔案變化,其中fs.inotify.max_user_watches 表示同一用戶同時可以新增的watch數目(watch一般是針對目錄,決定了同時同一使用者可以監控的目錄數量)

因此,查看了一下系統目前的max_user_watches 值

$ cat /proc/sys/fs/inotify/max_user_watches
8192
登入後複製

8192是預設值,可能是這個值太小,而我的app下的檔案目錄太多,於是試著修改一下

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
登入後複製

修改後查看一下修改結果

$ cat /proc/sys/fs/inotify/max_user_watches
524288
登入後複製

好了,試試修改結果吧,再次測試webpack 的熱部署功能,一切正常了。

上面是我整理給大家的,希望今後會對大家有幫助。

相關文章:

在vue元件中如何實作全域註冊和局部註冊

在vue中如何實作自訂全域方法

在Vue2.0中如何實作子同級元件之間資料互動

#

以上是在Webpack中解決熱部署偵測不到檔案變更的問題的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

VUE3入門教學:使用Webpack進行打包和構建 VUE3入門教學:使用Webpack進行打包和構建 Jun 15, 2023 pm 06:17 PM

Vue是一款優秀的JavaScript框架,它可以幫助我們快速建立互動性強、高效性好的Web應用程式。 Vue3是Vue的最新版本,它引入了許多新的功能和功能。 Webpack是目前最受歡迎的JavaScript模組打包器和建置工具之一,它可以幫助我們管理專案中的各種資源。本文就為大家介紹如何使用Webpack打包和建構Vue3應用程式。 1.安裝Webpack

vite和webpack的差別是什麼 vite和webpack的差別是什麼 Jan 11, 2023 pm 02:55 PM

差異:1、webpack伺服器啟動速度比vite慢;由於vite啟動的時候不需要打包,也就不需要分析模組依賴、編譯,所以啟動速度非常快。 2.vite熱更新比webpack快;vite在HRM方面,當某個模組內容改變時,就讓瀏覽器去重新請求該模組即可。 3.vite用esbuild預先建置依賴,而webpack基於node。 4.vite的生態不如webpack,載入器、插件不夠豐富。

Tomcat如何熱部署 Tomcat如何熱部署 Dec 28, 2023 pm 05:41 PM

Tomcat熱部署的步驟:1.直接把專案web資料夾放在webapps裡;2、在server.xml檔案中加入Context標籤;3、在「%tomcat_home%\conf\Catalina\localhost」中加入XML檔案; 4、發布項目;5、注意事項;6、使用第三方工具;7、效能和穩定性;8、安全性;9、監控和日誌;10、文件和支援。

如何使用PHP和webpack進行模組化開發 如何使用PHP和webpack進行模組化開發 May 11, 2023 pm 03:52 PM

隨著Web開發技術的不斷發展,前後端分離、模組化開發已成為了廣泛的趨勢。 PHP作為一種常用的後端語言,在進行模組化開發時,我們需要使用一些工具來實現模組的管理和打包,其中webpack是一個非常好用的模組化打包工具。本文將介紹如何使用PHP和webpack進行模組化開發。一、什麼是模組化開發模組化開發是指將程式分解成不同的獨立模組,每個模組都有自己的作

webpack怎麼將es6轉成es5的模組 webpack怎麼將es6轉成es5的模組 Oct 18, 2022 pm 03:48 PM

設定方法:1.用導入的方法把ES6程式碼放到打包的js程式碼檔案中;2、利用npm工具安裝babel-loader工具,語法「npm install -D babel-loader @babel/core @babel/preset- env」;3、建立babel工具的設定檔「.babelrc」並設定轉碼規則;4、在webpack.config.js檔案中設定打包規則即可。

使用Spring Boot和Webpack建構前端工程和插件系統 使用Spring Boot和Webpack建構前端工程和插件系統 Jun 22, 2023 am 09:13 AM

隨著現代Web應用程式的複雜性不斷增加,建立優秀的前端工程和插件系統變得越來越重要。隨著SpringBoot和Webpack的流行,它們成為了一個建構前端工程和插件系統的完美組合。 SpringBoot是一個Java框架,它以最小的配置需求來建立Java應用程式。它提供了許多有用的功能,例如自動配置,使開發人員可以更快、更輕鬆地建立和部署Web應用程式。 W

Webpack是什麼?詳解它是如何運作的? Webpack是什麼?詳解它是如何運作的? Oct 13, 2022 pm 07:36 PM

Webpack是一款模組打包工具。它為不同的依賴創建模組,將其整體打包成可管理的輸出檔案。這一點對於單頁面應用程式(現今Web應用的事實標準)來說特別有用。

vue webpack可打包哪些文件 vue webpack可打包哪些文件 Dec 20, 2022 pm 07:44 PM

在vue中,webpack可以將js、css、圖片、json等檔案打包為適當的格式,以供瀏覽器使用;在webpack中js、css、圖片、json等檔案類型都可以被當作模組來使用。 webpack中各種模組資源可打包合併成一個或多個包,並且在打包的過程中,可以對資源進行處理,如壓縮圖片、將scss轉成css、將ES6語法轉成ES5等可以被html識別的文件類型。

See all articles