gulpを使ってS3にWebサイトをアップロードしてみたのでメモ。
今までは作成したWebサイトをプレビューするとき、CyberduckというFTPツールを使用してS3のプレビュー環境にデプロイしていましたが、セキュリティソフトとの相性などが原因で接続が不安定になることが多くなったので、gulp-s3というプラグインを使用してみました。
ダウンロード
まずはターミナル画面でnpm install --save-dev gulp-s3
gulpfile.js
次にgulpfile.jsに以下の通り追記。
gulpfile.js
var s3 = require('gulp-s3') var gulp = require('gulp') var AWS = { "key": process.env.AWS_ACCESS_KEY_ID, //<=これでダメなら "AWS_ACCESS_KEY_ID" で。 "secret": process.env.AWS_SECRET_ACCESS_KEY, //<=これでダメなら "AWS_SECRET_ACCESS_KEY" で。 "bucket": "dev.example.com", //バケット名 "region": "eu-west-1" //リージョン名 } gulp.task('upload', () => { gulp.src('./dist/**').pipe(s3(AWS)); }); // es6使えないときは下記で //gulp.task('upload', function(){ // gulp.src('./dist/**').pipe(s3(AWS)); //});
タスク実行
ターミナル画面でgulp upload
参考
- 脱FTP!一瞬でS3にファイル転送 https://speakerdeck.com/mi/tuo-ftp-shun-des3nihuairuzhuan-song
- GulpでAWSのS3に簡単デプロイして静的サイトを作成する http://qiita.com/narikei/items/9179cfd234adb20d5da8
所感
FTPツールを使うよりも高速にアップロードすることができ便利さを実感。
待ち時間もエラーもなくなりストレスが一つ減らすことができました!