precompiling-assets-failed.md

I'm trying to deploy a Rails app to Heroku. When I do I get the following error:

remote: ! Precompiling assets failed.

I am pretty sure it has something to do with the custom style.css file I have in my assets/stylesheets folder, and/or webpacker but I can't figure out how to resolve.

$ rails -v returns Rails 6.1.3.1. $ ruby -v returns ruby 2.7.0p0.

In my app/views/layouts/application.html.erb file I have the following within the <head> section.

<%= stylesheet_link_tag 'style.css' %>

In my config/application.rb file, I have:

require_relative "boot"

require "rails/all"

Bundler.require(*Rails.groups)

module Sherlock
  class Application < Rails::Application
    config.load_defaults 6.1
    config.assets.initialize_on_precompile = false
    config.serve_static_assets = true
  end
end

Here's my Gemfile:

source 'https://rubygems.org'
git_source(:github) { |repo| "https://github.com/#{repo}.git" }

ruby '2.7.0'

gem 'rails', '~> 6.1.3'
gem 'pg', '~> 1.1'
gem 'puma', '~> 5.0'
gem 'sass-rails', '>= 6'
gem 'webpacker', '~> 5.0'
gem 'turbolinks', '~> 5'
gem 'jbuilder', '~> 2.7'
gem 'bootsnap', '>= 1.4.4', require: false

group :development, :test do
  gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
end

group :development do
  gem 'web-console', '>= 4.1.0'
  gem 'rack-mini-profiler', '~> 2.0'
  gem 'listen', '~> 3.3'
  gem 'spring'
end

group :test do
  gem 'capybara', '>= 3.26'
  gem 'selenium-webdriver'
  gem 'webdrivers'
end

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]

When I run rake assets:precompile, I get:

yarn install v1.22.10
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning " > [email protected]" has unmet peer dependency "webpack@^4.27.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^4.4.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-dev-server > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
[4/4] 🔨  Building fresh packages...
✨  Done in 9.82s.
...
Compiling...
Compilation failed:
yarn run v1.22.10
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command "webpack" not found.

Running gem list returns webpacker (5.2.1).

Running bundle exec rails webpacker:install returns Webpacker successfully installed.

$ heroku buildpacks returns heroku/ruby.

$ rails webpacker:compile returns

Warning: you are using an unstable release of Node.js (v15.5.1). If you encounter issues with Node.js, consider switching to an Active LTS release. More info: https://docs.npmjs.com/try-the-latest-stable-version-of-node
Compiling...
Compilation failed:
yarn run v1.22.10
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command "webpack" not found.

No changes made to my webpacker.yml file.

# Note: You must restart bin/webpack-dev-server for changes to take effect

default: &default
  source_path: app/javascript
  source_entry_path: packs
  public_root_path: public
  public_output_path: packs
  cache_path: tmp/cache/webpacker
  webpack_compile_output: true

  # Additional paths webpack should lookup modules
  # ['app/assets', 'engine/foo/app/assets']
  additional_paths: []

  # Reload manifest.json on all requests so we reload latest compiled packs
  cache_manifest: false

  # Extract and emit a css file
  extract_css: false

  static_assets_extensions:
    - .jpg
    - .jpeg
    - .png
    - .gif
    - .tiff
    - .ico
    - .svg
    - .eot
    - .otf
    - .ttf
    - .woff
    - .woff2

  extensions:
    - .mjs
    - .js
    - .sass
    - .scss
    - .css
    - .module.sass
    - .module.scss
    - .module.css
    - .png
    - .svg
    - .gif
    - .jpeg
    - .jpg

development:
  <<: *default
  compile: true

  # Reference: https://webpack.js.org/configuration/dev-server/
  dev_server:
    https: false
    host: localhost
    port: 3035
    public: localhost:3035
    hmr: false
    # Inline should be set to true if using HMR
    inline: true
    overlay: true
    compress: true
    disable_host_check: true
    use_local_ip: false
    quiet: false
    pretty: false
    headers:
      'Access-Control-Allow-Origin': '*'
    watch_options:
      ignored: '**/node_modules/**'


test:
  <<: *default
  compile: true

  # Compile test packs to a separate directory
  public_output_path: packs-test

production:
  <<: *default

  # Production depends on precompilation of packs prior to booting for performance.
  compile: false

  # Extract and emit a css file
  extract_css: true

  # Cache manifest.json for performance
  cache_manifest: true

Here's my package.json file:

{
  "name": "sherlock",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "css-loader": "^5.2.0",
    "css-minimizer-webpack-plugin": "^1.3.0",
    "mini-css-extract-plugin": "^1.4.0",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^3.11.2"
  }
}

andrewgordon@Andrews-Mac sherlock % RAILS_ENV=production rails assets:precompile

yarn install v1.22.10
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning " > [email protected]" has unmet peer dependency "webpack@^4.27.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^4.4.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "webpack-dev-server > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
[4/4] 🔨  Building fresh packages...
✨  Done in 2.50s.
Warning: you are using an unstable release of Node.js (v15.5.1). If you encounter issues with Node.js, consider switching to an Active LTS release. More info: https://docs.npmjs.com/try-the-latest-stable-version-of-node
Compiling...
Compilation failed:
[webpack-cli] Failed to load '/Users/andrewgordon/Sites/sherlock/config/webpack/production.js' config
[webpack-cli] TypeError: Cannot read property 'toWebpackConfig' of undefined
    at Object.<anonymous> (/Users/andrewgordon/Sites/sherlock/config/webpack/production.js:5:30)
    at Module._compile (/Users/andrewgordon/Sites/sherlock/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:973:32)
    at Function.Module._load (node:internal/modules/cjs/loader:813:14)
    at Module.require (node:internal/modules/cjs/loader:997:19)
    at require (/Users/andrewgordon/Sites/sherlock/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at loadConfig (/Users/andrewgordon/Sites/sherlock/node_modules/webpack-cli/lib/webpack-cli.js:1322:31)
    at /Users/andrewgordon/Sites/sherlock/node_modules/webpack-cli/lib/webpack-cli.js:1409:74
    at Array.map (<anonymous>)

On a fresh Rails 6.x app, I get this error:

Webpacker::Manifest::MissingEntryError in Welcome#index

Webpacker can't find application.js in /Users/andrewgordon/Sites/myapp/public/packs/manifest.json. Possible causes:
1. You want to set webpacker.yml value of compile to true for your environment
   unless you are using the `webpack -w` or the webpack-dev-server.
2. webpack has not yet re-run to reflect updates.
3. You have misconfigured Webpacker's config/webpacker.yml file.
4. Your webpack configuration is not creating a manifest.
Your manifest contains:
{
}

Showing /Users/andrewgordon/Sites/myapp/app/views/layouts/application.html.erb where line #10 raised:
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

apgordon/precompiling-assets-failed.md

Select an option

No results found

Select an option

No results found