タスク自動化
概要
tasks/ ディレクトリには、Gruntタスクとそれらの設定が含まれています。
タスクは主に、フロントエンドのアセット（スタイルシート、スクリプト、クライアントサイドのマークアップテンプレートなど）をバンドルするのに役立ちますが、browserifyコンパイルからデータベース移行まで、あらゆる種類の反復的な開発作業を自動化するためにも使用できます。
Sailsは利便性のためにいくつかのデフォルトタスクをバンドルしていますが、文字通り何百ものプラグインから選択できるため、最小限の労力であらゆるものを自動化するためにタスクを使用できます。必要なものがまだ構築されていない場合は、常に作成し、独自の Grunt プラグインをnpmに公開できます！
以前にGruntを使用したことがない場合は、入門ガイドを確認してください。Gruntプラグインをインストールして使用する方法だけでなく、Gruntfileを作成する方法についても説明しています。
アセットパイプライン
アセットパイプラインは、ビューに挿入されるアセットを整理する場所であり、tasks/pipeline.jsファイルにあります。これらのアセットの構成は簡単で、Gruntのタスクファイル構成とワイルドカード/glob/splat パターンを使用します。これらは3つのセクションに分類されます。
挿入するCSSファイル
これは、HTMLに<link>タグとして挿入されるCSSファイルの配列です。これらのタグは、それらが現れる任意のビューの<!--STYLES--><!--STYLES END-->コメントの間に挿入されます。
挿入するJavaScriptファイル
これは、HTMLに<script>タグとして挿入されるJavaScriptファイルの配列です。これらのタグは、それらが現れる任意のビューの<!--SCRIPTS--><!--SCRIPTS END-->コメントの間に挿入されます。ファイルは配列に表示される順序で挿入されるため、依存関係を持つファイルの前に依存関係のパスを配置する必要があります。
挿入するテンプレートファイル
これは、JST関数にコンパイルされ、jst.jsファイルに配置されるHTMLファイルの配列です。次に、このファイルは、HTMLの<!--TEMPLATES--><!--TEMPLATES END-->コメントの間に<script>タグとして挿入されます。
タスク構成JSファイルの一部でも、同じGruntのワイルドカード/glob/splatパターンとタスクファイル構成が使用されます。それらも変更したい場合は、そうしてください。
タスク構成
構成されたタスクは、Gruntfileの実行時に従うルールのセットです。これらは完全にカスタマイズ可能で、tasks/config/ディレクトリにあります。これらのGruntタスクを、要件に合わせて変更、省略、または置き換えることができます。独自のGruntタスクを追加することもできます。このディレクトリにsomeTask.jsファイルを追加して新しいタスクを構成し、適切な親タスクに登録します(tasks/register/*.jsのファイルを参照)。Sailsには、設定なしですぐに使用できるように設計された便利なデフォルトタスクのセットが付属していることを忘れないでください。
カスタムタスクの構成
プロジェクトにカスタムタスクを構成するのは非常に簡単で、Gruntのconfigおよびtask APIを使用して、タスクをモジュール化できます。既存のタスクを置き換える新しいタスクを作成する簡単な例を見てみましょう。デフォルトで構成されているアンダースコアテンプレートエンジンではなく、Handlebarsテンプレートエンジンを使用するとします。
- 最初の手順は、ターミナルで次のコマンドを使用してHandlebars Gruntプラグインをインストールすることです。
npm install grunt-contrib-handlebars --save-dev
- 次に、
tasks/config/handlebars.jsに構成ファイルを作成します。ここにHandlebars構成を配置します。
// tasks/config/handlebars.js
// --------------------------------
// handlebar task configuration.
module.exports = function(grunt) {
// We use the grunt.config api's set method to configure an
// object to the defined string. In this case the task
// 'handlebars' will be configured based on the object below.
grunt.config.set('handlebars', {
dev: {
// We will define which template files to inject
// in tasks/pipeline.js
files: {
'.tmp/public/templates.js': require('../pipeline').templateFilesToInject
}
}
});
// load npm module for handlebars.
grunt.loadNpmTasks('grunt-contrib-handlebars');
};
- アセットパイプラインのソースファイルへのパスを置き換えます。ここでの唯一の変更点は、Handlebarsが拡張子.hbsのファイルを検索するのに対し、アンダースコアテンプレートは単純なHTMLファイルになる可能性があることです。
// tasks/pipeline.js
// --------------------------------
// asset pipeline
var cssFilesToInject = [
'styles/**/*.css'
];
var jsFilesToInject = [
'js/socket.io.js',
'js/sails.io.js',
'js/connection.example.js',
'js/**/*.js'
];
// We change this glob pattern to include all files in
// the templates/ direcotry that end in the extension .hbs
var templateFilesToInject = [
'templates/**/*.hbs'
];
module.exports = {
cssFilesToInject: cssFilesToInject.map(function(path) {
return '.tmp/public/' + path;
}),
jsFilesToInject: jsFilesToInject.map(function(path) {
return '.tmp/public/' + path;
}),
templateFilesToInject: templateFilesToInject.map(function(path) {
return 'assets/' + path;
})
};
- HandlebarsタスクをcompileAssetsおよびsyncAssets登録済みタスクに含めます。これがJSTタスクが使用されていた場所です。ここで、新しく構成されたHandlebarsタスクに置き換えます。
// tasks/register/compileAssets.js
// --------------------------------
// compile assets registered grunt task
module.exports = function (grunt) {
grunt.registerTask('compileAssets', [
'clean:dev',
'handlebars:dev', // changed jst task to handlebars task
'less:dev',
'copy:dev',
'coffee:dev'
]);
};
// tasks/register/syncAssets.js
// --------------------------------
// synce assets registered grunt task
module.exports = function (grunt) {
grunt.registerTask('syncAssets', [
'handlebars:dev', // changed jst task to handlebars task
'less:dev',
'sync:dev',
'coffee:dev'
]);
};
- JSTタスク構成ファイルを削除します。これを使用しなくなったため、
tasks/config/jst.jsを削除できます。プロジェクトから削除するだけです。
理想的には、プロジェクトとプロジェクトのNode依存関係から削除する必要があります。これは、ターミナルでこのコマンドを実行することで実行できます。
npm uninstall grunt-contrib-jst --save-dev
タスクトリガー
開発モードでは、Sailsはdefaultタスク(tasks/register/default.js)を実行します。これにより、LESS、CoffeeScript、およびクライアント側のJSTテンプレートがコンパイルされ、アプリの動的なビューと静的なHTMLページから自動的にリンクされます。
本番環境では、Sailsはdefaultと同じ役割を共有するだけでなく、アプリのスクリプトとスタイルシートを最小化するprodタスク(tasks/register/prod.js)を実行します。これにより、アプリケーションのロード時間と帯域幅の使用量が削減されます。
これらのタスクトリガーは、「基本的な」Gruntタスクであり、tasks/register/フォルダにあります。以下に、Sailsのすべてのタスクトリガーの完全なリファレンスと、それらを起動するコマンドを示します。
sails lift
defaultタスク(tasks/register/default.js)を実行します。
sails lift --prod
prodタスク(tasks/register/prod.js)を実行します。
sails www
すべての資産を.tmp/publicではなくwwwサブフォルダーにコンパイルする、buildタスク (tasks/register/build.js)を実行します。参照では相対パスを使用します。これにより、'wwwミドルウェア'に依存する代わりに、ApacheまたはNginxで静的コンテンツを提供できます。
sails www --prod (本番)
buildタスクと同じことを行うだけでなく、アセットを最適化するbuildProdタスク(tasks/register/buildProd.js)を実行します。
NODE_ENVを設定し、同じ名前のタスクリストをtasks/register/に作成することで、他のタスクを実行できます。たとえば、NODE_ENVがQAの場合、sailsはtasks/register/QA.jsが存在する場合に実行します。
sailsjs.comでのエクスペリエンスを向上させるために、ブラウザを更新してください。
概念
愛を込めて作られました
Sailsフレームワークは、テキサス州オースティンにあるウェブ＆モバイルショップによって、貢献者の協力のもと作成されました。私たちはNode.jsプロジェクトを支援するために2012年にSailsを作成しました。当然のことながら、オープンソースにしました。それがあなたの生活を少しでも楽にすることを願っています！
© 2012-2024 The Sails Company.
Sailsフレームワークは、MITライセンスの下で無料でオープンソースです。
イラストはEdamameによるものです。