Search code examples
cssruby-on-railswebpackpostcsswebpacker

postcss can't find config when requiring a package's css file


I'm trying to make rails work with webpack using webpacker. But when I deploy to production, it fails with:

   ERROR in /home/user/app/shared/~/css-loader!/home/user/app/shared/~/postcss-loader!/home/user/app/shared/~/sass-loader/lib/loader.js!/home/user/app/shared/~/bootstrap-fileinput/css/fileinput.css
   Module build failed: Error: No PostCSS Config found in: /home/user/app/shared/node_modules/bootstrap-fileinput/css

Since .postcssrc.yml is located at /home/user/app/tmp/build-.../.postcssrc.yml, which is not down the file tree relative to /home/user/app/shared/node_modules/bootstrap-fileinput/css/fileinput.css. Because I'm sharing node_modules dir between releases. What do I do, other then not share the dir?


Solution

  • I was able to make it work by specifying config file explicitly:

    diff --git a/config/webpack/loaders/sass.js b/config/webpack/loaders/sass.js
    index faba9d5..6fc902c 100644
    --- a/config/webpack/loaders/sass.js
    +++ b/config/webpack/loaders/sass.js
    @@ -4,6 +4,11 @@ module.exports = {
       test: /\.(scss|sass|css)$/i,
       use: ExtractTextPlugin.extract({
         fallback: 'style-loader',
    -    use: ['css-loader', 'postcss-loader', 'sass-loader']
    +    use: ['css-loader', {
    +      loader: 'postcss-loader',
    +      options: {
    +        config: '.postcssrc.yml',
    +      },
    +    }, 'sass-loader']
       })
     }
    

    But that most likely disables config files that nodejs packages might have. Not sure if that matters.

    Some more or less relevant links.