Visual StudioでBundler＆Minifierツールを使用する方法2015

Question

最近、私はASP.NET Coreを使用してプロジェクトを開発しました。私はそのような疑問を持っている：私はそれが一つにいくつかのCSSやJSを組み合わせることができますツールは存在しているのであれば、私のビューページで参照してくださいしたい多くのcssとjsファイルがあります。それは私が結果をしteたい

<link href="~/Content/css/a1.css" rel="stylesheet" asp-append-version="true" /> 
<link href="~/Content/css/a2.css" rel="stylesheet" asp-append-version="true" /> 

を次のようにすることをされている。

<link href="~/bundles/css/a.min.css" rel="stylesheet" asp-append-version="true" /> 

は、その後、私はGoogleでそれを検索し、私はツールBundler& Minifier、Visual Studioでの拡張を得ました。私は自分のプロジェクトにbundleconfig.jsonファイルを書く方法を知りたいですか？ cssまたはjsファイルを結合する方法を教えてください。

Answer 1

asp.netコアプロジェクトでBundler &ミニナーを使用する方法はいくつかあります。最も一般的なのは、下図のように、単に既存のproject.jsonファイルのツールセクション内BundlerMinifier.Coreへの参照を追加し、BundlerMinifier.Coreツールを使用するにはBundlerMinifier.Coreツール

を使用している：

"tools": { 
    "BundlerMinifier.Core": "2.0.238", 
    "Microsoft.AspNetCore.Razor.Tools": "1.0.0-preview2-final", 
    "Microsoft.AspNetCore.Server.IISIntegration.Tools": "1.0.0-preview2-final" 
} 

ツールを追加したら、バンドル内に含めるファイルを構成するために使用するbundleconfig.jsonファイルをプロジェクトに追加する必要があります。最小構成は、以下に見られることができます。

[ 
    { 
    "outputFileName": "wwwroot/css/site.min.css", 
    "inputFiles": [ 
     "wwwroot/css/site.css" 
    ] 
    }, 
    { 
    "outputFileName": "wwwroot/js/site.min.js", 
    "inputFiles": [ 
     "wwwroot/js/site.js" 
    ], 
    "minify": { 
     "enabled": true, 
     "renameLocals": true 
    }, 
    "sourceMap": false 
    }, 
    { 
    "outputFileName": "wwwroot/js/semantic.validation.min.js", 
    "inputFiles": [ 
     "wwwroot/js/semantic.validation.js" 
    ], 
    "minify": { 
     "enabled": true, 
     "renameLocals": true 
    } 
    } 
] 

あなたのバンドルが設定された後、次のコマンドを使用して、既存のファイルをバンドルし、縮小化することができます

dotnet bundle 

ビジュアルために利用可能なBundler & Minifier extensionもありますStudioを使用すると、ファイルをバンドルしてサイズを小さくするのに役立ちます。