NPMを使用してCSSファイルを1つのファイルに結合

Question

私のプロジェクトにはいくつかのCSSファイルがあります。 NPM（ガルプやハラハラしていない）を介してのみ、それらを単一のものにすることをお奨めします。

私はccs-mergeと他のノードモジュールについて聞いたことがありますが、実際の例は見当たりませんでした。 これを達成する最も簡単で簡単な方法は何ですか？

編集：

Client/ 
    ├──js/ 
     |──component1 
       ├──one.css 
       ├──one.js 
     |──component2 
       ├──two.css 
       ├──two.js 
    ├──output/ 
    └──package.json 

私はNPMスクリプトから直接単一のファイルにすべての私のCSSファイルを結合したい：

がここに私のプロジェクト構造です。 は、ここに私の現在のpackage.json

"scripts": { 
    "start": "watchify -o Client/js/bundle.js -v -d Client/js/app.jsx", 
    "build": "browserify . -t [envify --NODE_ENV production] | uglifyjs -cm > Client/js/bundle.min.js", 
    "concat-css": "css-concat Client/js/*.css > Client/js/styles.css" 
    }, 

連結-CSSコマンドが動作しませんです。 「.... 『CSS化連結...』で失敗しました

Answer 1

は、ここで私が考える可能性が最も単純な例だ次のプロジェクト構造とファイルを考える：。

project/ 
├──css/ 
| ├──one.css 
| └──two.css 
├──output/ 
└──package.json 

プロジェクト/ CSS/1。 CSS：

.one { 
    color: red; 
} 

プロジェクト/ CSS/two.css：

.two { 
    text-align: center; 
} 

プロジェクト/ package.json：

あなたのターミナルでこれを実行することができます

{ 
    "name": "project", 
    "version": "1.0.0", 
    "scripts": { 
    "concat-css": "cat css/* > output/all.css" 
    } 
} 

：

プロジェクト/出力/ all.cssになり

$ npm run concat-css 

> project@1.0.0 concat-css /path/to/project 
> cat css/* > output/all.css 

：

.one { 
    color: red; 
} 
.two { 
    text-align: center; 
} 

これは明らかに過度に単純化されていますが、概念を実証するはずです。 npm run scriptsを介して複数のシェルコマンドをパイプすることができ、他の実行スクリプト内から実行スクリプトを呼び出すこともできます。

Here's a very good article about this topic by Keith Cirkel. No grunt or gulp needed.