成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

基于gulp的一個(gè)簡(jiǎn)單的處理多個(gè)api域名環(huán)境的開發(fā)工作流

bergwhite / 2286人閱讀

摘要：簡(jiǎn)單的工作流基于利用進(jìn)行多環(huán)境域名開發(fā)打包轉(zhuǎn)壓縮前言最近苦于搬磚，我們有三個(gè)開發(fā)環(huán)境，不同的環(huán)境的的域名不一樣，像我這么懶的人只能一鍵打包，不太適用，沒(méi)辦法，只能寫一個(gè)基于的，適合自己用的工作流了，哎一聲長(zhǎng)嘆傳送門在中使用

gulp-simple-workflow-multi-host

github

簡(jiǎn)單的工作流 基于Gulp 利用 gulp-preprocess 進(jìn)行多環(huán)境（api域名）開發(fā)、打包


sass轉(zhuǎn)css css&js&html壓縮
前言

最近苦于搬磚，我們有三個(gè)開發(fā)環(huán)境，不同的環(huán)境的api的域名不一樣，像我這么懶的人只能一鍵打包，webpack不太適用，沒(méi)辦法，只能寫一個(gè)基于gulp的，適合自己用的工作流了，哎~~~（一聲長(zhǎng)嘆）

gulp-preprocess

傳送門

在html中使用

test環(huán)境下轉(zhuǎn)換效果

在中使用

var host
// @if HOST_ENV="test"
host = "testhost"
// @endif
// @if HOST_ENV="qa"
host = "qahost"
// @endif

test環(huán)境下轉(zhuǎn)換效果

var host
host = "testhost"
調(diào)試 dev

自動(dòng)刷新

不壓縮

## 開發(fā)啟動(dòng) 默認(rèn)test環(huán)境，（gulpfile.js里面配置）
npm run dev

## 調(diào)試指定的域名,可選host test qa pe （gulpfile.js里面配置）
npm run dev-host test
命令做了什么

清空dist

把dev文件處理完傳到dist中

觀察dev中的文件，有變化的進(jìn)行步驟2

開啟一個(gè)服務(wù)器

觀察dist中的文件，有變化即刷新瀏覽器

打包 build

壓縮

## 打包全部
npm run build-all

## 打單個(gè)環(huán)境的包, 可選host test qa pe （gulpfile.js里面配置）
npm run build test
命令做了啥

清空對(duì)應(yīng)路徑

把文件處理傳送到指定的路徑中

調(diào)試打包效果 
dev 源代碼路徑，dist 開發(fā)調(diào)試的路徑 ， output 打包路徑
├── README.md
├── dev
│?? ├── example.js
│?? └── index.html
├── dist
│?? ├── example.js
│?? └── index.html
├── gulpfile.js
├── output
│?? ├── pe
│?? │?? ├── example.js
│?? │?? └── index.html
│?? ├── qa
│?? │?? ├── example.js
│?? │?? └── index.html
│?? └── test
│??     ├── example.js
│??     └── index.html
├── package.json
└── tree.txt

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/84383.html

相關(guān)文章

  • 移動(dòng)端H5多頁(yè)開發(fā)拍門磚經(jīng)驗(yàn)

    摘要：以下會(huì)以其中一個(gè)以公積金頁(yè)面開發(fā)項(xiàng)目作為例子，介紹移動(dòng)端的一些常見問(wèn)題和使用作為進(jìn)行多頁(yè)開發(fā)的經(jīng)驗(yàn)。所以要想在微信開發(fā)調(diào)試工具中獲取，我們需要使用一種叫做內(nèi)網(wǎng)穿透的工具。 showImg(https://segmentfault.com/img/remote/1460000015405042?w=800&h=600);兩年前剛接觸移動(dòng)端開發(fā)，剛開始比較疑惑，每次遇到問(wèn)題都是到社區(qū)里提問(wèn)...

    hightopo 評(píng)論0 收藏0

  • 聊聊webpack

    摘要：但是由于缺乏規(guī)范化管理，出現(xiàn)了很多種模塊化規(guī)范，從針對(duì)的規(guī)范，到針對(duì)瀏覽器端的，終于在里規(guī)范了前端模塊化?？梢酝ㄟ^(guò)兩種方式之一終端或。導(dǎo)出多個(gè)配置對(duì)象運(yùn)行時(shí)，所有的配置對(duì)象都會(huì)構(gòu)建。在階段又會(huì)發(fā)生很多小事件。 隨著前端的迅速發(fā)展，web項(xiàng)目復(fù)雜度也是越來(lái)越高。為了便捷開發(fā)和利于優(yōu)化，將一個(gè)復(fù)雜項(xiàng)目拆分成一個(gè)個(gè)小的模塊，于是模塊化開發(fā)出現(xiàn)了。但是由于缺乏規(guī)范化管理，出現(xiàn)了很多種模塊化規(guī)范...

    Ashin 評(píng)論0 收藏0

  • 實(shí)時(shí)編輯

    摘要：靜態(tài)服務(wù)器代理你的域名或注入通過(guò)流的方式創(chuàng)建任務(wù)流程這樣您就可以在您的任務(wù)完成后調(diào)用，所有的瀏覽器將被告知的變化并實(shí)時(shí)更新因?yàn)橹辉诤跄脑诰幾g完成后注意后調(diào)用重載。 方法一 使用Google Chrome DevTools 方法二 工作區(qū)Browsersync 安裝 Node.js BrowserSync是基于Node.js的, 是一個(gè)Node模塊， 如果您想要快速使用它，也許您需要先...

    wenshi11019 評(píng)論0 收藏0

  • Webpack 愛與恨

    摘要：關(guān)于標(biāo)題，為什么是愛與恨因?yàn)樵趧偝鰜?lái)的時(shí)候，我并不是堅(jiān)定的支持者，有很多地方用起來(lái)不方便，設(shè)計(jì)不合理。用戶只有首次訪問(wèn)需要下載全部靜態(tài)資源，以后的訪問(wèn)都直接使用緩存資源。首先，在中添加字段，當(dāng)為時(shí)，則開啟服務(wù)。例如請(qǐng)求的是則返回中的數(shù)據(jù)。 關(guān)于標(biāo)題，為什么是愛與恨？ 因?yàn)樵?webpack 剛出來(lái)的時(shí)候，我并不是堅(jiān)定的支持者，有很多地方用起來(lái)不方便，api 設(shè)計(jì)不合理。隨著 webpa...

    HmyBmny 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<