# 第四週|課程直播|切版班 by Sz ###### tags: `Sz` `第四週` `直播筆記` `2021夏季切版班` 多頁式 gulp [課前該用好的 gulp by Sz](/JIqaY79XQxqolJVJr3YZug) ## 每日助教 我不要再回答問題ㄌ ## 就業程度、如何發想作品 vue 作品實戰班 ## 環境建立 每個公司都有自己的環境建置 學到的 gulp 是六角的使用版本 ## layout 利用樣板語言 不同頁面的重複內容 不要重複寫 拉出來獨立檔案來統一管理 ### 瀏覽器看不懂 ejs 他是便於輸出的檔案格式,最後會編譯為正常的 html ### <%-content %> 神祕符號,樣板語言 ### html 置頂內容 這裡放很多變數~可以自己加 ``` --- title: <title> // head 裡面那個 title 標籤 layout: ./app/layout.ejs // 共同版型, header, footer 終於幸福ㄌ engine:ejs // 使用的樣板語言,跟我們所學的內容很像 current:index // 暫時不動囉 --- <body 內容> ``` ### 用一個大 div 包住不同頁面 html 這樣就可以分開不同頁面的 class 了 ## NPM 套件:軍火庫 可以拿來下載 bootstrap、jQuery、各種各種 核心:node.js ### 跟 cdn 的差別 npm 可以透過指令就更新 而且不用四處去網站找資料 ### node.js 安裝 ![](https://i.imgur.com/99cSDSw.png) ### 前端任務工具 先會用工具就好 想知道原理可以之後再去研究 ## 【問】 ### layout 能不能包 layout 複製貼上比較合適(目前只有一層的 layout ) ### 如果吃兩個layout要怎麼寫呢? 目前先不要 等神人筆記囉! ### gulp裡面的任務跟功能等等 都要自己寫嗎(在業界中) 一人前端 團隊前端(3人up) 技術長通常偏後端 有沒有好的前輩,緣分 ### 如果直接在github上面改README.md內容是不是會出錯? >如果在網頁上改內容,記得本地端也要同步更新之後才可以繼續push喔,不然會出錯唷 ### layout: ./app/layout.ejs 的點 斜線 是甚麼一絲呢 ./ 是當下位置 ../ 上一層位置 ./assets = assets ### 如果想讓qa以及index.html在不同的子資料夾,該怎麼做? 建議先放同一層 ### 如果想讓qa以及index.html的a連結設定active樣式~,該怎麼做呢? ejs:class設定變數 html 置頂 新增變數 ## scss