Vue 動態載入 - HINA::工程幼稚園

[Vue] Vue CLI 3+ 動態載入實例

鐵人賽之後，我實在對於沒辦法用 Vue CLI 3.0 來組合出動態載入，感到有點小小挫折。不過，畢竟所謂的 vue.config.js 其實，背後也都還是 Webpack 的設定，只是被封裝起來大家看不到而已。那麼，總是會有辦法把他做出來。對，我做出來了，終究他還是 Webpack 所以其實也沒有非常困難。然後 Vue 出了 4.0 結果 3.0

VueJS

[IT 鐵人賽] 動態載入 webpack 簡易設定 Day 24

今天說好要提到 Webpack 的部分，然後，我最近其實有點疲憊，所以今天就先講一下目前在使用的 Webpack 就好了。只是說，我可能不會多加解釋就是。說好的 Webpack 'use strict' /** * @author Scar Wu, Hina Chen. */ // Load Libraries const path = require('path') const webpack = require('webpack') const webpackLodashPlugin = require('lodash-webpack-plugin')

VueJS

[IT 鐵人賽] 動態載入 CSS Style Day 23

其實樣式這件事情，是不是有動態載入好像不是那麼重要。除非你像是 AMP 那樣嚴格規範你的樣式使用範圍，不然通常我們都是全部打一包丟上去。然後就大家都用那一包了，你看看精美的 Bootstrap ，你會因為沒有使用到什麼設定而把他拿掉嗎？通常不會。或者是你可以做一個客製化的 Bootstrap ，然後拿去偽裝成 bootstrap.min.css ，你這樣試試看後續接手的人會不會叫你出來，然後保證不打死你？樣式區塊我們在 Vue 裡面其實有支援 CSS Modules 的作法： Vue.js 與 CSS Modules CSS Modules

VueJS

[IT 鐵人賽] 動態載入 Vue App Day 22

昨天又再次說到動態載入元件，今天則來聊一下 Vue App 是不是也能做這種事情。我們之前在第七天的時候有稍微提了一下。基本上就是 90% 以上的人不會做這種事，然後我大概就是那個 10% 會做這種蠢事的人。我說過了，如果是兩組 App 想要綁定在不同的地方，溝通上會是個問題。根據昨天我尚未釋出的 Webpack 的結構來說，也不是一件不能做到的事情。至於什麼時候會釋出，大概就是等 Day 24 我聊到 Webpack 設定的時候吧（奸詐）。 Hybrid 加上多個

VueJS

[IT 鐵人賽] 動態載入 Components Day 21

我們又回到動態載入系列了，如果覺得我很煩的話可以先行離席沒關係。由於我昨天整理 Dockfile 的時候有點過於厭世，所以今天我這邊一樣會帶入一些昨天的結構，至於說 Dockfile 的話還沒好，如果想要先看結構的，可以先去我的 Github 上面看。 ITHome Ironman 2019 Hybrid App 混合模式的動態載入其實我比較偷懶，上面的例子我直接掃全部的資料夾，然後將檔案加入樣版中。不過這個將來一定會壞調壞掉，所以小朋友不要亂學。 $jsFiles = ['main.js']; foreach (new \DirectoryIterator(ROOT