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

資訊專欄INFORMATION COLUMN

PostCSS自學(xué)筆記（二）【番外篇二】

FleyX / 1074人閱讀

摘要：之前有研究過(guò)做過(guò)假設(shè)，在插件列表中，的插件執(zhí)行順序自上而下，一切看起來(lái)似乎是沒(méi)有任何問(wèn)題的。再有摘自深入設(shè)計(jì)摘自寫(xiě)的姿勢(shì)這兩張圖則應(yīng)該是說(shuō)明了我之前的假設(shè)，插件中的執(zhí)行順序自上而下。先來(lái)看看一片來(lái)自的這段會(huì)不會(huì)跟這個(gè)有關(guān)呢，我先埋個(gè)伏筆。

圖解PostCSS的插件執(zhí)行順序 
文章其實(shí)是一系列的早就寫(xiě)完了. 才發(fā)現(xiàn)忘了發(fā)在SegmentFault上面, 最早發(fā)布于https://gitee.com/janking/Inf...

這次我繼續(xù)研究PostCSS的插件的執(zhí)行順序。

之前有研究過(guò)做過(guò)假設(shè)，在插件列表中，PostCSS的插件執(zhí)行順序自上而下，一切看起來(lái)似乎是沒(méi)有任何問(wèn)題的。

我也看過(guò)有關(guān)PostCSS解析器的相關(guān)文章，有以下一些收獲：

摘自：PostCSS 是個(gè)什么鬼東西？

當(dāng)然這張圖并沒(méi)有對(duì)Plugin System進(jìn)行解釋。

再有：

摘自：深入PostCSS Web設(shè)計(jì)

摘自：寫(xiě)CSS的姿勢(shì)

這兩張圖則應(yīng)該是說(shuō)明了我之前的假設(shè)，插件中的執(zhí)行順序自上而下。

但是這些資料不明不白的，我決定進(jìn)一步閱讀相關(guān)文章找出真相，不過(guò)研究過(guò)程中，我也依然深思這樣一個(gè)問(wèn)題，也許我本不應(yīng)該糾結(jié)這個(gè)，因?yàn)榛蛟S根本沒(méi)有意義？或者這個(gè)工作方式并非與PostCSS本身有關(guān)？

于是我又把之前收集的PostCSS的文章翻了一遍，我們?cè)賮?lái)一個(gè)個(gè)過(guò)一遍。

POSTCSS PLUGIN INSTALLATION EXAMPLE

先來(lái)看看一片來(lái)自smashingmagazine的這段POSTCSS PLUGIN INSTALLATION EXAMPLE

In the array, we can include the necessary require statements that return the plugins and that are then called immediately. If you would like to read more about this concept, look through “Functions as First-Class Citizens in JavaScript” by Ryan Christiani.

會(huì)不會(huì)跟這個(gè)有關(guān)呢，我先埋個(gè)伏筆。

PostCSS Quickstart Guide: Exploring Pluginsd

再來(lái)看看另一篇PostCSS Quickstart Guide: Exploring Pluginsd的Plugin Execution Sequence中這段

One of the main considerations you have to make when loading up the array of PostCSS plugins is the order in which you run them. You’ll have to pause and think through your list, determining if one plugin might need to run after another in order to do what you want it to.

鄙人譯：有一個(gè)非常重要的需要考慮的一點(diǎn)是，當(dāng)你在加載PostCSS插件數(shù)組中順序就是你執(zhí)行他們的順序。因此你有必要好好在這個(gè)插件列表這下功夫思考一下，來(lái)確定你想要的一個(gè)接一個(gè)的插件執(zhí)行順序。

原文第一句話很復(fù)雜，所以英語(yǔ)不好的理解起來(lái)可能有些費(fèi)勁，姑且可以分成以下幾段分別翻譯再合并One of the main considerations you have to make when loading up the array of PostCSS plugins is the order in which you run them.

然后這段原文后也有示例，大家可以自己看看加深理解和認(rèn)識(shí)。并且也有一個(gè)小結(jié)論：

The load order for plugins is something that will change with each set of plugins, so you may find you just need to do a little experimentation sometimes to get everything working together nicely.

鄙人譯：你所設(shè)置的每個(gè)插件都會(huì)被加載的插件順序所影響，因此強(qiáng)烈建議你在某些情況下多做些測(cè)試來(lái)讓你的插件們運(yùn)行的更加完美~

好了看到這里，其實(shí)答案大致已經(jīng)揭曉，也許你覺(jué)得這不是很自然的從上而下么，為何作者要糾結(jié)這么久還寫(xiě)了這么一篇長(zhǎng)篇大論的文章。如果你還沒(méi)看過(guò)之前我為何糾結(jié)這個(gè)順序問(wèn)題，可以看看:

PostCSS自學(xué)筆記（二）【插件篇】#CSSNANO

PostCSS自學(xué)筆記（二）【番外篇一】

結(jié)論

其實(shí)，關(guān)于順序的疑問(wèn)我覺(jué)得差不多就此打住，也許其中的確有些奇怪的現(xiàn)象，但是這個(gè)基本不影響或者說(shuō)沒(méi)有追究其根本的意義，或許真要打破沙鍋問(wèn)到底就要發(fā)郵件給PostCSS作者了。而作為普通開(kāi)發(fā)人員，也許沒(méi)有必要花太多精力去研究這個(gè)，我們知道PostCSS插件的順序一般來(lái)說(shuō)是從上往下執(zhí)行的，不要犯低級(jí)的順序錯(cuò)誤（例如import寫(xiě)在列表末尾），大部分場(chǎng)景都會(huì)得到我們想要的結(jié)果了

（突然想起來(lái)了，前面埋了個(gè)伏筆其實(shí)跟它沒(méi)啥關(guān)系，所以不多做文章了~不過(guò)作為課外閱讀，多了解下也是棒棒噠?。?/p> 其他

關(guān)于我個(gè)人的PostCSS一系列學(xué)習(xí), 介紹及總結(jié), 有興趣可以參閱:

PostCSS自學(xué)筆記（一）【安裝使用篇】

PostCSS自學(xué)筆記（二）【插件篇】

PostCSS自學(xué)筆記（二）【番外篇一】

PostCSS自學(xué)筆記（二）【番外篇二】

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

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

相關(guān)文章

  • PostCSS自學(xué)筆記（二）【番外篇一】

    摘要：通過(guò)配置規(guī)則和單位使用或來(lái)解決。其他關(guān)于我個(gè)人的一系列學(xué)習(xí)介紹及總結(jié)有興趣可以參閱自學(xué)筆記一安裝使用篇自學(xué)筆記二插件篇自學(xué)筆記二番外篇一自學(xué)筆記二番外篇二 利用PostCSS解決移動(dòng)端REM適配問(wèn)題 上一期有提到結(jié)合postcss-px2rem插件來(lái)處理移動(dòng)端適配的方案，以及相關(guān)的避坑方法，之后總覺(jué)得這個(gè)解決方案問(wèn)題太多，也就誕生了另一套方案運(yùn)用postcss-pxtorem插件來(lái)進(jìn)行...

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

  • PostCSS自學(xué)筆記（一）【安裝使用篇】

    摘要：而則可制定個(gè)人需求的一套解決方案僅安裝需要的插件。迫不及待的你已經(jīng)等不及安裝使用了吧。安裝及使用一般是結(jié)合自動(dòng)化工具使用，如果要單獨(dú)使用可以安裝，這里我先對(duì)的安裝使用講解下。接下來(lái)說(shuō)點(diǎn)實(shí)際的，如何利用結(jié)合自動(dòng)化工作在項(xiàng)目中使用。 PostCSS介紹 PostCSS是一個(gè)利用JS插件來(lái)對(duì)CSS進(jìn)行轉(zhuǎn)換的工具，這些插件非常強(qiáng)大，強(qiáng)大到無(wú)所不能。其中，Autoprefixer就是眾多Post...

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

  • PostCSS自學(xué)筆記（二）【插件篇】

    摘要：本期主要介紹以下幾個(gè)插件和幾個(gè)坑和坑這個(gè)就不用多說(shuō)了，必裝插件之一?？此茖?xiě)法沒(méi)有任何問(wèn)題。編譯后的結(jié)果那么這樣就沒(méi)有問(wèn)題了。 PostCSS常用插件介紹 繼上一次PostCSS學(xué)習(xí)指南（一）后，漸漸開(kāi)始在項(xiàng)目中應(yīng)用。 這次決定主要講解一些個(gè)人認(rèn)為非常有幫助的PostCSS插件。 本期主要介紹以下幾個(gè)插件和幾個(gè)坑 autoprefixer postcss-partial-import...

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

  • 番外篇2-基本規(guī)范、注釋、static關(guān)鍵字、import關(guān)鍵字

    摘要：今日份重點(diǎn)命名規(guī)范注釋關(guān)鍵字關(guān)鍵字總結(jié)命名規(guī)范規(guī)范的包名名字管理是所有編程語(yǔ)言都必須重視的一個(gè)問(wèn)題。比如說(shuō)百度，其域名為，那么其對(duì)應(yīng)的應(yīng)用的包名前綴就應(yīng)該為。是誰(shuí)這么大牌總結(jié)本文主要介紹了中的命名規(guī)范注解關(guān)鍵字關(guān)鍵字等內(nèi)容。 歡迎關(guān)注我的微信公眾號(hào)，共同打牢Java的基礎(chǔ)，向著遠(yuǎn)方進(jìn)擊 showImg(https://segmentfault.com/img/bVboaBO?w=129...

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

  • 【EOS】番外篇一、在win10下開(kāi)發(fā)遇到坑

    摘要：一坑非常吃硬件，版本最低的硬件內(nèi)存也是需要。之前進(jìn)行環(huán)境開(kāi)發(fā)，裝的是虛擬機(jī)，但是虛擬機(jī)最高支持的內(nèi)存是目前我的電腦是這樣。三坑幸虧公司有多余的機(jī)器，讓我來(lái)裝一下系統(tǒng)。常見(jiàn)的盤(pán)啟動(dòng)制作，沒(méi)有制作的，只能制作，很致命。 一、坑1 EOS非常吃硬件，v1.5版本最低的硬件內(nèi)存也是需要7G。之前進(jìn)行ubuntu環(huán)境開(kāi)發(fā)，裝的是虛擬機(jī)VMware Workstation Pro，但是虛擬機(jī)最高支...

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

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

0條評(píng)論

閱讀需要支付1元查看
<