Tagged

Webpack

A collection of 4 posts

新手 VueJS 2 + Webpack 開發設定
VueJS

新手 VueJS 2 + Webpack 開發設定

不借助 NuxtJS 下開始動手架起一個 VueJS 的架構,我們會使用 Webpack 建立起有 hot-reload 的開發環境。 開發環境 為了有效地在本地開發,最近使用了 Visual Studio Code 為開發工具 (以下簡稱 VSC )。雖然是 Microsoft 開發的工具, 但背後跟 Github 開發的 Atom 使用了相同的 Electron 架構來開發,速度跟 Atom 相比有過之而無不及,而且最大的好處是原生功能比 Atom 的外掛功能穩定,所以我由 Atom 轉用了 VSC。 下載 Windows/MacOS/Linus 的版本後,先安裝一些推介使用的 Extensions。 順序解說一下 Beautify - 用來快速整理頁面

NuxtJS

Webpack loaderUtils.parseQuery()問題

在執行nuxt build的時候常常出現以下警告 $ (node:495) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56 連網址也有就去看看https://github.com/webpack/loader-utils/issues/56 似乎是Webpack loader上remove了parseQuery問題引起了錯誤 要在webpack.config.js中加入process.traceDeprecation = true才能防些此問題出現。 但是在NuxtJS中沒有webpack.config.js要加在那? 答案就是看起來名字很像的nuxt.config.js 解決方法 process.traceDeprecation = true process.noDeprecation = true

NuxtJS 100% CPU
NuxtJS

NuxtJS 100% CPU

CPU直升100% 開發時不知是什麼原故,伺服器CPU一直衝到100%以上 用htop查看一下就發現是我的Vue搞出來的,而且伺服器供應商不繼向我發出警告Email! 解決方法 然後在GitHub找到了應該是解決方法,似乎是Webpack跟Nodejs的問題。 就是將整個node_modules移除再安裝! 好吧... $ sudo rm -rf node_modules $ npm install 重新安裝node_modules後,CPU Loading似乎回復正常了

用NuxtJS取代Webpack+Express
NodeJS

用NuxtJS取代Webpack+Express

簡化版的Vue2架構 發現了NuxtJS這東西,可以簡易取代webpack+express+router的部份,雖然我已經完成了Webpack+Express架構部份。但是router跟server side render沒NuxtJS方便,而NuxtJS的概念是跟據React的NextJS做成,其中hot reload部份對開發十分有幫助。 Nuxt.js這東西是整合了Vue2 + Vue-Router + Vuex + Vue-Meta + Express + Webpack而成,能快速組成基本開發架構,省下不少時間。 Ubuntu 16.04.1 LTS NodeJS 6.9.4 npm 3.10.10 VueJS 2.0 Webpack 2.1.0-beta.22 Express 4.14.1 PM2 2.3.