中包含特定樣式表或javascript在問題

我正在爲不同客戶端提供不同版本（產品）的Ember.js項目。雖然功能差不多，但每種產品的造型都有很大的不同。因此，我們有「默認」和產品特定樣式表。我被要求修改構建代碼，以便只有相應的.css（.less）文件被編譯到最終的應用程序中。在ember-cli-build

本來我是從錯誤的一面看這個問題：我試圖排除包含不必要的文件的文件夾，但很少成功。直到那時我才意識到，它更有意義而不是默認包含產品特定文件，並在構建期間將它們添加到樹中。

解決方案

改變我的觀點後，我發現有另一種方法。我更改了樣式表，以便所有「默認外觀」都進入import-base.less，並且我爲每個產品創建了import-[name_of_product].less，後者包含導入語句爲默認外觀，所以我只有一個文件要構建。使用EmberApp中的outputPaths選項，並假定產品的名稱存儲在名爲FLAVOUR的過程環境變量中，我的代碼如下所示。

// ember-cli-build.js 

/* global require, module */ 
var EmberApp = require('ember-cli/lib/broccoli/ember-app'); 

module.exports = function(defaults) { 
    // y u do dis 
    const options = { outputPaths: { app: { css: { app: false } } } }; 

    const lessFileName = 'import-' + process.env.FLAVOUR.toLowerCase(); 
    options.outputPaths.app.css[lessFileName] = 'assets/application.css' 

    const app = new EmberApp(defaults, options); 

    return app.toTree(); 
};

總有一些

與該代碼唯一的問題是，它仍然需要一個app.less和該行代碼，否則構建失敗，不能（還沒有來得及）找出一個解決方案。

我也不得不提的是，上述解決方案不能解決原來的問題，這是：
如何使用app.toTree()，這樣他們就不會增加文件大小不必要之前排除從工作目錄的特定文件。 Lux非常友善，並指出可能在回購插件是用於這種目的。再次，沒有時間檢查。 :(

來源

2016-04-01 Abel

這裏做什麼，你可以在Brocfile做的是[pastebin鏈接]（http://pastebin.com/hig1nkdW）到我的'ember-cli-build.js'文件中，以防你想檢查它。我刪除了不相關的代碼行。 – Abel

我想你可以只使用funnel

是這樣的：！

return new Funnel(app.toTree(), { 
    include: ['**/*'] 
    exclude: ['styles/*.css'] 
});

一般你可以在你ember-cli-build.js

來源

2016-04-06 21:06:42 Lux

感謝你的回覆我試過了，但不幸的是沒有成功，在已編譯的dist/app.js中，排除文件中的行仍然出現，這意味着我這樣做的原因，減少最終文件大小的問題仍然存在。如果我可以幫助任何日誌或此類請讓我知道。 – Abel

我以爲你想從最終輸出中刪除文件。如果你有這些文件的編譯步驟，你必須在這之前進行過濾。可以使用in-repo插件。 – Lux

好的，我重新檢查了整個過程，並在一些排除函數的幫助下console.log（）我意識到你在說什麼。 .toTree（）返回已編譯的樹進行處理，因此無法排除我想要的文件夾。你能否給我提供一些類似的簡單in-repo-addon或除文檔以外的任何示例？另外我會重寫我的問題，以便更好地反映我的問題。 – Abel

在ember-cli-build

中包含特定樣式表或javascript在問題

解決方案

總有一些

回答

相關問題