Sign in Subscribe

NuxtJS

重用PM2作管理系統

重用PM2作管理系統

更新PM2 2.4.4後發現NuxtJS也可以正常Hot Reload，加上forever多次發生loading 100%的問題，所以全面改用PM2作NuxtJS的管理。 $ pm2 update $ pm2 -v 2.4.4 更新到最新版本 使用PM2管理NuxtJS 想好好管理NuxtJS使用PM2還是最方便，因為即使出現問題，restart 15次後說會暫停你的應用程式，以免對伺服器有過大的負擔。 由於要使用npm script來啟動NuxtJS，普通pm2 start的方式起動不了 $ pm2 start npm --name AppName -- run start e.g.你的程式叫AppName，起動script叫start * --name AppName是用來命名你的App * -- run start是用來啟動npm run start $ pm2 list ┌──────────┬────┬──────┬───────┬────────┬─────────┬────────┬─────┬────────────┬───
Edmond Yip
Sass in NuxtJS

Sass in NuxtJS

以前對Sass/SCSS等需要預處理的CSS Style有一定抗拒，因為需要安裝一堆應用程式，每次更新都需要處理一次，但是現在在NuxtJS中有Vue Loader處理，不論那一種需要預處理的CSS都可以輕鬆搞定。 在多種預處理的CSS中我先是賞試了Sass，不用再加任何標點符號真的很棒！ Sass nav ul { margin: 0; padding: 0; list-style: none; } nav li { display: inline-block; } nav a { display: block; padding: 6px 12px; text-decoration: none; } 原本是這樣的CSS nav ul margin: 0 padding: 0 list-style: none li display: inline-block a display: block padding: 6px 12px
Edmond Yip

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 = tr
Edmond Yip
NuxtJS + Socket.io + https

NuxtJS + Socket.io + https

我希望在NuxtJS中以Socket.io為傳送資料的方式，不過功力有限連Socket.io都沒搞定。發現NuxtJS官方其實有實例是在https中運作。 不過事情當然沒這麼簡單，官方上沒有什麼說明，我也只好當成NuxtJS一樣安裝。 $ npm install nodemon 這個例子用了nodemon作管理，我也直接照用好了 先安裝一下 $ npm run dev 啟動看一下 Socket.io不能通過https，瀏覽器會就說Mixed Content，就是https的頁面要取資料一定要經https才安全。 解決方法 想到解決的方法有兩個 * 把Socket.io變成https * 令到Socket.io不用https也能通過 經過一輪測試才找到方法 因為NuxtJS官方版本是用https的，我曾在nuxt.config.js內更改很多東西也不成，最後發現要修改如下 env: { HOST_URL: process.env.HOST_URL || 'https://www.256pages.com' }
Edmond Yip
用NuxtJS取代Webpack＋Express

用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.
Edmond Yip