株式会社TECH LUCKという会社で代表兼エンジニアをしている齊藤です。
前提
Rails6.1 + Webpackerで今更感がありますが、まとめておいたことをせっかくなので公開しました。
# エラーの内容
デプロイの際のアセットコンパイルの際にエラーになってしまい、コンパイルができない状態になっていました。
対処法
config/webpack/loaders/sass.js
を以下の記述で作成します。
config/webpack/loaders/sass.js
module.exports = {
test: /\.s?css/i,
use: ['style-loader', 'css-loader', 'sass-loader'],
}
config/webpack/environment.js
に以下の記述を追加して、さきほど作ったsass.jsファイルを読み込ませます。
config/webpack/environment.js
const { environment } = require('@rails/webpacker')
const sass = require('./loaders/sass') //ここを追加
const webpack = require('webpack')
environment.plugins.prepend(
'Provide',
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
Popper: ['popper.js', 'default']
})
)
environment.loaders.append('sass', sass) //ここを追加
module.exports = environment
これでアセットコンパイルができるようになり、デプロイすることができました。