鄙人新手,看了很多大神的使用gulp搭建的編譯es6環(huán)境,也自己動(dòng)手試了一下,但還是不太明白如何在實(shí)際項(xiàng)目中使用.
看到大神寫的例子,是把多個(gè)es6檔案編譯成的js檔案最後都合併在了一個(gè)bundle.js檔案中,在頁(yè)面中引用的也是bundle.js。
而我現(xiàn)在的專案有多個(gè)頁(yè)面,像是a.html需要引用a.js和jquery.js,b.html需要引用b.js和jquery.js,c.html需要引用b.js、c .js和jquery.js。這種情況下到底該如何去編譯文件,在html中又該如何使用呢?
認(rèn)證0級(jí)講師
第一種你說(shuō)的情況是你自己寫的gulp
任務(wù),將多個(gè)文件最終合并成為一個(gè)bundle.js
文件。
同樣的,對(duì)於第二個(gè)你說(shuō)的場(chǎng)景,你只需要寫多個(gè)gulp
任務(wù),最終分別不同的入口文件打包不同的a.js
,b.js
等等。
在html
文件中對(duì)應(yīng)引入即可,gulp
作為build
工具可以用在任何環(huán)境,畢竟生產(chǎn)環(huán)境用的不過(guò)也只是產(chǎn)生的文件而已。
gulp
的自定義任務(wù)可以壓縮和合并js
文件,只需要申明文件路徑即可。bundle.js
應(yīng)該是webpack
生成的,webpack
針對(duì)ES6和瀏覽器具有兼容性優(yōu)化。在html
中可以直接在index.html
裡引用壓縮合併後的js即可
在gulp
的watch
事件中添加針對(duì)js
文件的監(jiān)聽,這樣即可在有任何監(jiān)聽的js
文件被修改后重新壓縮合并所有js
檔案用於更新