瀏覽器環境下的前端編譯

說到前端編譯，一般都會想到Webpack的各種Plugin及Loader，多數時候我們都只知道這個庫能幫我們把代碼編譯成什麼樣，按部就班，卻並不清楚具體做了什麼。今天換個思路，聊一聊瀏覽器環境下如何做前端編譯。

轉變思路

什麼時候需要在前端環境下去做編譯呢？
我們習慣了在本地倉庫編寫代碼，打包編譯後上傳服務器，一切都剛剛好。不過在一定情況下這種方式其實也限制了我們的生產力，我們無法從原始的代碼文件獲取代碼文件管理相關的信息。

HTML

• Posthtml

JavaScript

• babel

Css

• Sassjs
• Postcss

Vue

• vue-template-compiler
  • compiler.parseComponent(file, [options])