Ruby - Webpacker can't find application in - ruby-on-rails

After installing the device gem, I encountered an error. How can i fix this:
Webpacker can't find application in /home/grkmdgn06/Desktop/my5_homework/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:
{
}
Extracted source (around line #9):
...
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> # error line
...

perhaps your node.js is out of date
try this:
sudo npm install n -g
sudo n stable
bundle exec rake webpacker:install

Related

Unable to deploy TailwindCSS on a Rails 6 app to Heroku

I'm currently trying to deploy my rails 6 application to Heroku. I tried the answer in a post about a similar issue but had no luck.. I'm not sure where the error is coming from since the styles work well on development but break when pushing to production. Not sure if it has to do with the fact that it is currently compiling css assets with sass?
[14] ./node_modules/#rails/actiontext/app/javascript/actiontext/index.js + 1 modules 2.64 KiB {0} [built]
remote: | 2 modules
remote: + 7 hidden modules
remote:
remote: ERROR in ./app/javascript/stylesheets/application.scss
remote: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
remote: ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
remote:
remote: #import "tailwindcss/base";
remote: ^
remote: File to import not found or unreadable: tailwindcss/base.
remote: in /tmp/build_d98149372aae5001d8aada1182784254/app/javascript/stylesheets/application.scss (line 1, column 1)
remote: at runLoaders (/tmp/build_d98149372aae5001d8aada1182784254/node_modules/webpack/lib/NormalModule.js:316:20)
Not sure why is File to import not found or unreadable: tailwindcss/base. not loading. From the documentation on Tailwind it shows to add it via #import
javascript/stylesheets/application.scss
​
#import "tailwindcss/base";
#import "tailwindcss/components";
#import "tailwindcss/utilities";
Tailwind is also showing in the dependencies.
package.json
"version": "0.1.0",
"devDependencies": {
"tailwindcss": "^1.2.0",
"webpack-dev-server": "^3.7.1"
}
views/layouts/application.html.erb
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
if no asset processor is defined it defaults to sass which is what I'm using to compile the css. I thought this could be a reason why is not working.
config/environments/production.rb
# Compress CSS using a preprocessor.
# config.assets.css_compressor = :sass
config.assets.js_compressor = :uglifier
postcss.config.js
module.exports = {
plugins: [
require('tailwindcss'),
require('autoprefixer'),
require('postcss-import'),
require('postcss-flexbugs-fixes'),
require('postcss-preset-env')({
autoprefixer: {
flexbox: 'no-2009'
},
stage: 3
})
]
}
From reading the related Stack overflow post set extract_css: to true
webpacker.yml
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
What could the problem be?
"devDependencies": {
"tailwindcss": "^1.2.0",
"webpack-dev-server": "^3.7.1"
}
Tailwind is within dev dependencies so this won't work in production move the dependence outside of devDependencies so it can be used in production.

Rails 5 Request ran for longer than 5000ms

I'm stumped. I have a vanilla install of Rails 5 running within docker yet I'm constantly getting this error:
Request ran for longer than 5000ms
All I've done so far was generate a new controller with docker-compose run website rails g controller pages.
So far, if I remove (very important) lines from layouts/application.html.erb, I can get the page to load:
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
But I loose all my default styling (bootstrap) and any potential javascript files I wish to load later in life, which I do not consider to be a fix.
Anyone else run into this problem and know how to fix it?
#JimmyBaker answered in the comments
Try setting config.assets.debug to false
Inside config/development.rb
config.assets.debug = false
Having this set to false will cause all CSS & JS to be bundled into application.css or application.js More on assets.debug

ExecJS::ProgramError in Welcome#index

On Ubuntu 16.04 with Ruby 2.3.3, Rails 5.0.0.1, and NodeJS 4.2.6 installed, I generated a toy controller with bin/rails generate controller welcome index. After running bin/rails server, I opened http://localhost:3000/welcome/index in my browser to get the following error:
ExecJS::ProgramError in Welcome#index
Showing /rails-app-path/app/views/layouts/application.html.erb where line #7 raised:
ReferenceError: CoffeeScript is not defined
Extracted source (around line #7):
<%= csrf_meta_tags %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
This was answered Here
There is a problem in coffe-script-source gem 1.12.1 which was recently updated. the issue is that the source file in this version is empty. there is already an open issue , and it should be fixed soon.
For now you can add this to your GemFile
gem 'coffee-script-source', '= 1.11.1'
and run bundle update coffee-script-source until it's fixed.
As it turned out, a broken version 1.12.1 of the coffee-script-source gem had been uploaded. That version has now been unpublished, so the above hello world app now works (once I rebundled my gems).
ExecJS::ProgramError in Welcome#index error :
It's an easy fix you just have to rename a file,
app/views/layouts/application.html.erb
TO
app/views/layouts/default.html.erb
And then the magic happens :)

Ruby on Rails + Passenger unable to load cached assets

I just installed passenger and I believe I got it working, but now my rails application seems to be unable to load cached assets. When attempting to load a page I get this message:
ActionView::Template::Error (No such file or directory - /home/glawson/vidStream/tmp/cache/assets/sprockets%2Ff1663d34d4b6003379113df98f1433a520130421-27670-18ux0pw.lock):
2: <html>
3: <head>
4: <title>VidStream</title>
5: <%= stylesheet_link_tag "application", :media => "all" %>
6: <%= javascript_include_tag "application" %>
7: <%= csrf_meta_tags %>
8:
app/views/layouts/application.html.erb:5:in `_app_views_layouts_application_html_erb___4187138815701226714_20468720'
This happens when I try to run my webapp with passenger or in development with rails server. I'm a little fuzzy on what the error even means other than it can't find a file that it's looking for.
In production mode you need to precompile the asset directory using
RAILS_ENV=production rake assets:precompile
Then only it will work. Because by default for prod asset precompile is enabled.

Rails: How do you precompile custom stylesheet for production environment?

I've tried numerous fixes and variations of those fixes that I've found online but none work. My problem is that I have a custom stylesheet that is called if the browser is IE (stylesheet-ie.css.scss). I've ran the following with no success:
rake assets:precompile
I get the following error in production.log after running compile command.
ActionView::Template::Error (stylesheet-ie.css isn't precompiled):
14: <title><%= full_title(yield(:title)) %></title>
15: <%= stylesheet_link_tag "application", media: "all" %>
16: <!--[if IE]>
17: <%= stylesheet_link_tag("stylesheet-ie") %>
18: <![endif]-->
19: <%= javascript_include_tag "application" %>
20: <%= csrf_meta_tags %>
In production.rb I have:
config.assets.precompile += ['stylesheet-ie.css']
The file is assets/stylesheet/stylesheet-ie.css.scss...I had it as stylesheet.css before but changed it trying to get it to work. Neither way works.
At this point I don't know what else to do.
Does this work in development environment?
While doing a precompile, you will have to specify the environment. Are you doing this anywhere?
RAILS_ENV=production rake assets:precompile
This should compile your assets in case you are not mentioning your environment elsewhere.
Hrm.
I have my config/application.rb set up like this:
config.sass.load_paths << File.expand_path('../../lib/assets/stylesheets/')
config.assets.precompile += %w(jquery.animate-colors-min.js ie.js ie8.css)
So it's pretty similar, but you didn't mention the load_paths. (Also, BTW, I'm using .css.sass, so I'm not sure if you'll need to fiddle with config.sass or config.scss.)
—☈

Resources