分類: vue

最一開始，其實我是想用 js 更改 scss 變數內容來達到網站更換顏色的效果，查了一些資料之後發現，喔，這是不可行的啦。

scss 都叫 “預”處理器了，所以關於 scss 的資訊在檔案編譯成 css 的時候都會消失，也就無法再透過 javascript 去更改了。

這次做一個簡單的圖片燈箱(lightbox)，

並搭配swiper套件完成滑動效果，

有一天發現文章七零八落的不好找東西，想拉下來還自己忘記步驟，所以再整理一篇出來。

文章的 demo code 可以在我的 github 上面查看。
基於 vue 配置的 webpack
基於 react 配置的 webpack
 
有要拉下來實驗看看的話，記得進入到放 src 資料夾的地方安裝 node_modules ，然後 build 再 serve (如果想要測試一下 hot reload 效果的話)

頁面懶加載。

這次要來做圖片跟 css 的打包。scss 打包說明在文末，概括來說就是多裝幾個 loader。

本篇文章的 demo code 可以在這邊查看:

前面幾篇文章結束之後我們手邊有個簡單的專案了，

接下來我們來試試架個最簡單的網站。