はじめに
だいぶ頭悪い感じのタイトルになりましたが、何がしたかったかというと、
- django を heroku で動かしたい
- django-compressor を使いたい
- heroku は deploy 後に静的ファイルを追加できないので、compress したファイルを代わりに aws s3 に置きたい
- でも、es6 や sass の元ファイルは置きたくない（外部から参照させたくない）
です。
まるっと全部 s3 に、みたいな記事は探したら見つかったんですけど、compress したファイルだけというのが見つからなかったので、今回書きました。
※そして実はあまり意味なかったということが最後にわかりました。
どうしたか
まぁ、大したことはしてなくて、静的ファイルの参照先と compress する先を別々にしただけです。
具体的に
こうです（django は 1.11）。
※今動いている settings.py から網羅的に転機したつもりですけど、漏れていたら heroku docs や django-compressor、その他の blog を参照していただければと思います。。。
settings.py
# アプリやミドルウェアに compress などを追加
INSTALLED_APPS = [
...
'compressor',
...
]
MIDDLEWARE = [
...
'whitenoise.middleware.WhiteNoiseMiddleware',
]
# collectstatic した時の展開先。s3 に置かないような local で開発用の設定
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
# 静的ファイル置き場。sass などはここに置く
STATIC_URL = '/static/'
# compress するときの参照先設定
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
# 静的ファイル探すヤツラの指定
STATICFILES_FINDERS = [
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
'compressor.finders.CompressorFinder',
'npm.finders.NpmFinder',
]
# compress するコンパイラなどの指定
COMPRESS_PRECOMPILERS = (
('text/x-scss', 'compressor_toolkit.precompilers.SCSSCompiler'),
('module', 'compressor_toolkit.precompilers.ES6Compiler'),
)
COMPRESS_CSS_FILTERS = [
'compressor.filters.css_default.CssAbsoluteFilter',
'compressor.filters.cssmin.rCSSMinFilter',
]
# 以下、heroku 向け。local では不要
# s3 にアクセスするための鍵
AWS_ACCESS_KEY_ID = os.environ.get('AWS_ACCESS_KEY_ID')
AWS_SECRET_ACCESS_KEY = os.environ.get('AWS_SECRET_ACCESS_KEY')
# 静的ファイルへのアクセス設定
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'
COMPRESS_STORAGE = 'storages.backends.s3boto.S3BotoStorage'
COMPRESS_OFFLINE = True # ユーザがページを開いたときに compress しないようにする（事前に compress しないとエラーになる）
COMPRESS_ENABLED = True # メンドイので manifest.json を見て css を参照するようにする
# s3 先の指定
AWS_STORAGE_BUCKET_NAME = 'hogehoge'
AWS_S3_CUSTOM_DOMAIN = 's3.amazonaws.com/hogehoge'
上記を deploy したあとで、python manage.py compress すると、s3 にファイルが展開されます。
ただ、キャッシュが効いているのか、たまに OfflineGenerationError が発生していまします・・・対応策を調査中です（python manage.py mtime_cache -c すればいいのかな？ と思ってますが、まだ試せてません）。
本当は
deploy するときに、一緒に compress を実行できれば良いと思ったんですけど、どうもやり方がわからなかったので、s3 を使うことで回避してます。
おまけ
ここまで書いて気づきましたけど、static ディレクトリに es6 や sass が置いてあるってことは、確かに html からは呼び出されなくても、直接 url に打ち込めば参照できるのでは・・・あ、見れた・・・。