webpack alias for css import

webpack可以透過設定 path alias 讓在js內使用
import 或require更好管理
如果是在css或scss內使用
@import 會需要做一點修正

例 在webpack.config上設定了alias
'scss':path.resolve(__dirname, 'src/scss')
在css 的import
@import "~scss/xx"

Love Song

大二升大三那年的暑假
在臺北打工沒有回南部

7月的台北悶熱的天氣
白天在樹林的橡皮擦工廠工作
晚上去板橋當家教
晚上休息
回到租屋的地方
那個時候 沒有冷氣
風扇 其實 也沒什麼作用

窩在小小的木板床上
把學長給的一個涼墊拿去冰箱冰
到睡覺時拿來鋪在床上
睡到半夜還會熱醒

常常 只穿了件短褲 躺在床上
望著天花板
等自己可以夠涼快到可以睡著

書桌上 泛黃的檯燈旁
反覆的放著Testla那張
Live Man Acoustical Jam專輯
跟著彈著 唱著
彷彿自己參與了那樣的現場

一直到8月存夠了錢
把那把Ibanez電吉他買下來
才心滿意足的回南部 放暑假

避免WebSocket因連線中斷資訊不同步

在網頁上使用WebSocket
可以很方便的做即時的訊息廣播
但如果使用者的browser沒有開啟或是
當手機關閉螢幕時都會讓WebSocket停止連線

以socket.io為例
socket在被重新打開時,socket client會依序觸發disconnect事件
與connect事件,在這個時間點就可以做資料的更新
讓本機端與server的資料狀態

為避免使用者沒有接收到Socket廣播資料,而漏掉資訊
可以做以下兩的部分的處理
1.當使用socket發出廣播訊息時,同時
  儲存紀錄於db
2.當接收到connect 事件時
  呼叫api取回更新的資訊
這樣就可以保證使用者
永遠可看到最正確的資訊

泡咖啡

回到高雄上班的每一天
戴上耳機 一杯的咖啡
保留著以往 住在台北時的工作習慣
泡咖啡的時間 也是讓自己的視線短暫的脫離電腦
站在茶水間 往外看到的是一樣風景
如果有一天 離開這裡
應該會記得的
就是 這望出去的景象

讓vue 元件script預設以es2015解析

vue元件 預設並不會script 語言並非是es6
在webpack loader設定 以vue-loader載入vue元件
只是讓他可以載入.vue的檔案
但vue元件內的script並非預設就可以解析es6
即使你已經安裝了babel 可以對 es6的.js檔案做正確的解析
但對於.vue內的es6還是可能不會自動辨識解析

可以透過設定.babelrc 讓webpack以es2015解讀vue內的es6檔案

來讀取script部分
這部分可以透過設定.babel.rc來處理

.babelrc
{
  "presets": ["es2015", "stage-2"],
  "plugins": ["transform-runtime"],
  "comments": false
}