npm

新手 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 - 用來快速整理頁面

重用PM2作管理系統

NuxtJS

重用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 ┌──────────┬────┬──────┬───────┬────────┬─────────┬────────┬─────┬────────────┬───

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

新手試Ghost

Ghost

新手試Ghost

由以前慣用的Wordpress轉到來Ghost,可真學習了不少東西,首先是慣用的http server改成Node.js,跟以前安裝一個應用程式完全不同的概念。 為什麼要用Ghost? 2015年由NYS網站開始,幾乎所有平台也轉了做Wordpress,這個最多人使用的CMS平台。不過好景不常,用起來很多Functions也要安裝Plugin,Multipurpose的theme不便宜,而且多數配搭了Visual Composer,使用起來看似很方便,但按來按去還不如我自已用CSS比較快。 最後在朋友介紹下轉用Ghost。 Ghost是什麼鬼? Ghost是一個open source的發佈平台,基本上是一個極簡版的Wordpress,需設置在運行Node.js的伺服路上。 新手上路 * 安裝環境 * Ubuntu 16.04.1 LTS * Ghost 0.11.4 * Node.js 6.9.4 * npm 3.10.10 第一次使用Node.js,有點緊張,直接就用apt來安裝 $ sudo apt-get