gbarillot/rails-vue-demo-app

Rails 7 + Vite + Vue 3 + Pinia Demo App

rails-vue-demo-app's Issues

The packs directory should contain ONLY the entry files

Hi there,

First of all, thanks for this. It got me up & running in a Rails/Vue/Vuex environment very quickly, and has served as a great structure.

However, I came across an issue. The packs directory should only contain the entry files (ie, application.js and admin/application.js), and all other files should be external to that.

See here: rails/webpacker#1284 (comment)

If everything is within packs, everything is considered to be an entry file, which means you get out of memory errors as your application grows.

See also: https://github.com/rails/webpacker#usage

Note the line: # only webpack entry files here

Should HMR work just right out of the box?

I can't get HMR to work on the app. I must reload the page to see changes in JS files. I saw this on the vite ruby site:

But still doesn't work. Can you give me a hand, please?

Thanks

cannot load such file -- bundler/setup (LoadError)

per the instructions I get this when doing foreman start:

foreman start Ignoring bcrypt-3.1.11 because its extensions are not built. Try: gem pristine bcrypt --version 3.1.11 Ignoring bindex-0.5.0 because its extensions are not built. Try: gem pristine bindex --version 0.5.0 Ignoring byebug-10.0.0 because its extensions are not built. Try: gem pristine byebug --version 10.0.0 Ignoring ffi-1.9.23 because its extensions are not built. Try: gem pristine ffi --version 1.9.23 Ignoring nio4r-2.2.0 because its extensions are not built. Try: gem pristine nio4r --version 2.2.0 Ignoring nokogiri-1.8.2 because its extensions are not built. Try: gem pristine nokogiri --version 1.8.2 Ignoring puma-3.11.3 because its extensions are not built. Try: gem pristine puma --version 3.11.3 Ignoring sqlite3-1.3.13 because its extensions are not built. Try: gem pristine sqlite3 --version 1.3.13 Ignoring websocket-driver-0.6.5 because its extensions are not built. Try: gem pristine websocket-driver --version 0.6.5 13:27:22 web.1 | started with pid 2054 13:27:22 webpack.1 | started with pid 2055 13:27:22 webpack.1 | Ignoring bcrypt-3.1.11 because its extensions are not built. Try: gem pristine bcrypt --version 3.1.11 13:27:22 webpack.1 | Ignoring bindex-0.5.0 because its extensions are not built. Try: gem pristine bindex --version 0.5.0 13:27:22 webpack.1 | Ignoring byebug-10.0.0 because its extensions are not built. Try: gem pristine byebug --version 10.0.0 13:27:22 webpack.1 | Ignoring ffi-1.9.23 because its extensions are not built. Try: gem pristine ffi --version 1.9.23 13:27:22 webpack.1 | Ignoring nio4r-2.2.0 because its extensions are not built. Try: gem pristine nio4r --version 2.2.0 13:27:22 webpack.1 | Ignoring nokogiri-1.8.2 because its extensions are not built. Try: gem pristine nokogiri --version 1.8.2 13:27:22 webpack.1 | Ignoring puma-3.11.3 because its extensions are not built. Try: gem pristine puma --version 3.11.3 13:27:22 webpack.1 | Ignoring sqlite3-1.3.13 because its extensions are not built. Try: gem pristine sqlite3 --version 1.3.13 13:27:22 webpack.1 | Ignoring websocket-driver-0.6.5 because its extensions are not built. Try: gem pristine websocket-driver --version 0.6.5 13:27:22 webpack.1 | /Users/chabgood/.rvm/rubies/ruby-2.5.0/lib/ruby/2.5.0/rubygems/core_ext/kernel_require.rb:59:inrequire': cannot load such file -- bundler/setup (LoadError)
13:27:22 webpack.1 | from /Users/chabgood/.rvm/rubies/ruby-2.5.0/lib/ruby/2.5.0/rubygems/core_ext/kernel_require.rb:59:in require' 13:27:22 webpack.1 | from ./bin/webpack-dev-server:15:in

'
13:27:22 webpack.1 | exited with code 1
13:27:22 system | sending SIGTERM to all processes
13:27:22 web.1 | terminated by SIGTERM
`

Problem with rails 7.0.2.3 during bundle install

Hi. I've just downloaded your repo and wanted to try it out.

After cloning it, I installed ruby-2.6.5 (I'm using RVM) and bundler 2.3.12 to use the same version of everything.

When I ran bundle install, I got the following error:

Your bundle is locked to rails (7.0.2.3) from rubygems repository https://rubygems.org/ or installed locally, but that version can no longer be found in that source. That means the author of rails (7.0.2.3) ha removed it. You'll need to update your bundle to a version other than rails (7.0.2.3) that hasn't been removed in order to install.

Updating rails to version 7.0.2.4 is not possible as it requires ruby >= 2.7. So I modified .ruby-version to use ruby-2.7.2, installed that version using RVM and then run bundle install again. Everything works just fine now.

Thanks for the repo.

(wrong number of arguments (given 4, expected 3) on search for users and musicians

ArgumentError (wrong number of arguments (given 4, expected 3)):
09:20:03 web.1 |
09:20:03 web.1 | app/controllers/api/admin/users_controller.rb:5:in `index'

I did switch to use postgres.

Webpacker::Manifest::MissingEntryError in Admin#index

Error appears when directing to the Admin page on a Windows machine, the issue is related to webpack-dev-server not compiling the manifest files accordingly.

The application itself works on a regular 'rails s' though, but when going to the Admin page it will require a proper configuration or set up like using 'foreman start' or combining 'bundle exec rails s -p 3000' + './bin/webpack-dev-server --host 127.0.0.1' but turns out to be a Windows problem which spat out the following error.

`Showing C:/code/irc_app/app/views/admin.html.erb where line #27 raised:

Webpacker can't find admin/application.js in C:/code/irc_app/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:
   {
   "admin\application.js": "/packs/admin\application-ac1f63854cf901fd51fb.js",
   "admin\components\dashboard\index.js": "/packs/admin\components\dashboard\index-03825387d45ee20a6d7e.js",
   "admin\components\modals\chat.js": "/packs/admin\components\modals\chat-28bae40657ce63116d0b.js",
   "admin\components\musicians\_filters.js": "/packs/admin\components\musicians\_filters-f32493ec939ffaccd800.js",
   "admin\components\musicians\_form.js": "/packs/admin\components\musicians\_form-dba99d77e62719783268.js",
   "admin\components\musicians\edit.js": "/packs/admin\components\musicians\edit-08116779c3b45245605e.js",
   "admin\components\musicians\index.js": "/packs/admin\components\musicians\index-754e9ff50e2b12e9cf8b.js",
   "admin\components\musicians\new.js": "/packs/admin\components\musicians\new-a6cd0a7d5aaf04347c21.js",
   "admin\components\shared\_nav_top.js": "/packs/admin\components\shared\_nav_top-6a16fbfd1f096eccec78.js",
   "admin\components\shared\_pagination.js": "/packs/admin\components\shared\_pagination-35cb11b23a01308a5bfc.js",
   "admin\components\shared\_submit_tag.js": "/packs/admin\components\shared\_submit_tag-7440f1666801e1b724e3.js",
   "admin\components\users\_form.js": "/packs/admin\components\users\_form-48fec61fabbeb335126b.js",
   "admin\components\users\edit.js": "/packs/admin\components\users\edit-76f02ee9469e81272f8e.js",
   "admin\components\users\index.js": "/packs/admin\components\users\index-1aecd7b5d7a550c214e7.js",
   "admin\components\users\new.js": "/packs/admin\components\users\new-90be35b35ac37d70a252.js",
   "admin\event_bus.js": "/packs/admin\event_bus-2e548d7497d8fbbca4cd.js",
   "admin\filters\strings.js": "/packs/admin\filters\strings-f9fd0b025bcffa550ed6.js",
   "admin\helpers\index.js": "/packs/admin\helpers\index-7a7aa2efbde46ae225a6.js",
   "admin\routes.js": "/packs/admin\routes-19599d16ae40894f99d6.js",
   "admin\vuex\index.js": "/packs/admin\vuex\index-753a5e95cb382a657cb8.js",
   "admin\vuex\stores\chat_store.js": "/packs/admin\vuex\stores\chat_store-fb212eb67190f488dc30.js",
   "admin\vuex\stores\dashboard_store.js": "/packs/admin\vuex\stores\dashboard_store-7293d5e3d7a4118b477a.js",
   "admin\vuex\stores\musician_store.js": "/packs/admin\vuex\stores\musician_store-ce3d481cf756b8a618e4.js",
   "admin\vuex\stores\nav_top_store.js": "/packs/admin\vuex\stores\nav_top_store-2960487df4d448388d17.js",
   "admin\vuex\stores\user_store.js": "/packs/admin\vuex\stores\user_store-223a15345e905d328ddc.js",
   "application.js": "/packs/application-d0f678859343139f9aa9.js",
   "components\home\index.js": "/packs/components\home\index-27eb1e3b1afcfadd8c72.js",
   "components\musicians\index.js": "/packs/components\musicians\index-e3bed98d5e57f8f919af.js",
   "components\musicians\show.js": "/packs/components\musicians\show-19986831baab7cc841b5.js",
   "components\shared\_nav_top.js": "/packs/components\shared\_nav_top-7910aacbf4a415d65578.js",
   "filters\strings.js": "/packs/filters\strings-98482caecd1b92d6ccb2.js",
   "helpers\index.js": "/packs/helpers\index-e5d7d86395ddbd5fd898.js",
   "routes.js": "/packs/routes-478647596e01b7c95cde.js",
   "vuex\index.js": "/packs/vuex\index-2b72e3f3cf4e3007ec80.js",
   "vuex\stores\musician_store.js": "/packs/vuex\stores\musician_store-ca139dc023f56193f901.js"
   }`

The app not working in production mode

The app not working in production mode.

RAILS_ENV=production bundle exec rake secret
RAILS_ENV=production bundle exec rake db:migrate
RAILS_ENV=production bundle exec rake db:seed
RAILS_ENV=production bundle exec rake assets:precompile

Start puma.

bundle exec puma -e production

Error:

I, [2018-06-21T04:45:39.354065 #1905]  INFO -- : [764703a2-6de4-484b-9a3e-62bfbd2e504d] Started GET "/" for 172.17.0.1 at 2018-06-21 04:45:39 +0000
I, [2018-06-21T04:45:39.363789 #1905]  INFO -- : [764703a2-6de4-484b-9a3e-62bfbd2e504d] Processing by ApplicationController#index as HTML
I, [2018-06-21T04:45:39.363924 #1905]  INFO -- : [764703a2-6de4-484b-9a3e-62bfbd2e504d]   Parameters: {"locale"=>"en"}
I, [2018-06-21T04:45:39.366996 #1905]  INFO -- : [764703a2-6de4-484b-9a3e-62bfbd2e504d]   Rendering application.html.erb
I, [2018-06-21T04:45:39.372743 #1905]  INFO -- : [764703a2-6de4-484b-9a3e-62bfbd2e504d]   Rendered application.html.erb (5.6ms)
I, [2018-06-21T04:45:39.373032 #1905]  INFO -- : [764703a2-6de4-484b-9a3e-62bfbd2e504d] Completed 200 OK in 9ms (Views: 8.6ms)
I, [2018-06-21T04:45:39.439561 #1905]  INFO -- : [e75fc345-769e-43eb-aa33-952f20c5006b] Started GET "/assets/application-a7d87bae96496b796910b3d5c577d6119212011646d1bab4cde0d7d614130355.css" for 172.17.0.1 at 2018-06-21 04:45:39 +0000
I, [2018-06-21T04:45:39.440840 #1905]  INFO -- : [e75fc345-769e-43eb-aa33-952f20c5006b] Processing by ApplicationController#index as CSS
I, [2018-06-21T04:45:39.441018 #1905]  INFO -- : [e75fc345-769e-43eb-aa33-952f20c5006b]   Parameters: {"locale"=>"en", "path"=>"assets/application-a7d87bae96496b796910b3d5c577d6119212011646d1bab4cde0d7d614130355.css"}
I, [2018-06-21T04:45:39.442974 #1905]  INFO -- : [e75fc345-769e-43eb-aa33-952f20c5006b] Completed 500 Internal Server Error in 2ms
F, [2018-06-21T04:45:39.444536 #1905] FATAL -- : [e75fc345-769e-43eb-aa33-952f20c5006b]   
F, [2018-06-21T04:45:39.445146 #1905] FATAL -- : [e75fc345-769e-43eb-aa33-952f20c5006b] ActionView::MissingTemplate (Missing template /application with {:locale=>[:en], :formats=>[:css], :variants=>[], :handlers=>[:raw, :erb, :html, :builder, :ruby, :coffee, :jbuilder]}. Searched in:
  * "/home/developer/websites/rails-vue-demo-app/app/views"
  * "/usr/local/rvm/gems/ruby-2.5.1/gems/devise-4.4.3/app/views"
  * "/usr/local/rvm/gems/ruby-2.5.1/gems/kaminari-core-1.1.1/app/views"
):
F, [2018-06-21T04:45:39.445213 #1905] FATAL -- : [e75fc345-769e-43eb-aa33-952f20c5006b]   
F, [2018-06-21T04:45:39.445292 #1905] FATAL -- : [e75fc345-769e-43eb-aa33-952f20c5006b] app/controllers/application_controller.rb:5:in `index'
I, [2018-06-21T04:45:39.443448 #1905]  INFO -- : [822ada3b-2e2e-47fe-a147-6cafd0726afb] Started GET "/assets/application-44d17e8bbdf39e95930de94ae5654ce82b543cb205a55ac55b5ca125314d9519.js" for 172.17.0.1 at 2018-06-21 04:45:39 +0000
I, [2018-06-21T04:45:39.446286 #1905]  INFO -- : [822ada3b-2e2e-47fe-a147-6cafd0726afb] Processing by ApplicationController#index as */*
I, [2018-06-21T04:45:39.446407 #1905]  INFO -- : [822ada3b-2e2e-47fe-a147-6cafd0726afb]   Parameters: {"locale"=>"en", "path"=>"assets/application-44d17e8bbdf39e95930de94ae5654ce82b543cb205a55ac55b5ca125314d9519.js"}
I, [2018-06-21T04:45:39.445060 #1905]  INFO -- : [ac9b1ab3-5a30-4fa8-93b9-fd471480e8b5] Started GET "/packs/application-f73d5ebd30f5d7783872.js" for 172.17.0.1 at 2018-06-21 04:45:39 +0000
I, [2018-06-21T04:45:39.451154 #1905]  INFO -- : [ac9b1ab3-5a30-4fa8-93b9-fd471480e8b5] Processing by ApplicationController#index as */*
I, [2018-06-21T04:45:39.451335 #1905]  INFO -- : [ac9b1ab3-5a30-4fa8-93b9-fd471480e8b5]   Parameters: {"locale"=>"en", "path"=>"packs/application-f73d5ebd30f5d7783872.js"}
I, [2018-06-21T04:45:39.451995 #1905]  INFO -- : [ac9b1ab3-5a30-4fa8-93b9-fd471480e8b5]   Rendering application.html.erb
I, [2018-06-21T04:45:39.453515 #1905]  INFO -- : [ac9b1ab3-5a30-4fa8-93b9-fd471480e8b5]   Rendered application.html.erb (1.4ms)
I, [2018-06-21T04:45:39.453768 #1905]  INFO -- : [ac9b1ab3-5a30-4fa8-93b9-fd471480e8b5] Completed 200 OK in 2ms (Views: 1.9ms)
I, [2018-06-21T04:45:39.451555 #1905]  INFO -- : [822ada3b-2e2e-47fe-a147-6cafd0726afb]   Rendering application.html.erb
I, [2018-06-21T04:45:39.456522 #1905]  INFO -- : [822ada3b-2e2e-47fe-a147-6cafd0726afb]   Rendered application.html.erb (1.8ms)
I, [2018-06-21T04:45:39.457125 #1905]  INFO -- : [822ada3b-2e2e-47fe-a147-6cafd0726afb] Completed 200 OK in 10ms (Views: 10.1ms)
I, [2018-06-21T04:45:39.488301 #1905]  INFO -- : [68885701-d44e-46f9-ae1f-7093c702e4dc] Started GET "/assets/application-44d17e8bbdf39e95930de94ae5654ce82b543cb205a55ac55b5ca125314d9519.js" for 172.17.0.1 at 2018-06-21 04:45:39 +0000
I, [2018-06-21T04:45:39.489039 #1905]  INFO -- : [68885701-d44e-46f9-ae1f-7093c702e4dc] Processing by ApplicationController#index as */*
I, [2018-06-21T04:45:39.489126 #1905]  INFO -- : [68885701-d44e-46f9-ae1f-7093c702e4dc]   Parameters: {"locale"=>"en", "path"=>"assets/application-44d17e8bbdf39e95930de94ae5654ce82b543cb205a55ac55b5ca125314d9519.js"}
I, [2018-06-21T04:45:39.489822 #1905]  INFO -- : [68885701-d44e-46f9-ae1f-7093c702e4dc]   Rendering application.html.erb
I, [2018-06-21T04:45:39.491364 #1905]  INFO -- : [68885701-d44e-46f9-ae1f-7093c702e4dc]   Rendered application.html.erb (1.4ms)
I, [2018-06-21T04:45:39.491701 #1905]  INFO -- : [68885701-d44e-46f9-ae1f-7093c702e4dc] Completed 200 OK in 2ms (Views: 2.1ms)
I, [2018-06-21T04:45:39.503940 #1905]  INFO -- : [53cc03e4-c93a-4572-b904-73acf7f9415e] Started GET "/packs/application-f73d5ebd30f5d7783872.js" for 172.17.0.1 at 2018-06-21 04:45:39 +0000
I, [2018-06-21T04:45:39.505061 #1905]  INFO -- : [53cc03e4-c93a-4572-b904-73acf7f9415e] Processing by ApplicationController#index as */*
I, [2018-06-21T04:45:39.505212 #1905]  INFO -- : [53cc03e4-c93a-4572-b904-73acf7f9415e]   Parameters: {"locale"=>"en", "path"=>"packs/application-f73d5ebd30f5d7783872.js"}
I, [2018-06-21T04:45:39.506015 #1905]  INFO -- : [53cc03e4-c93a-4572-b904-73acf7f9415e]   Rendering application.html.erb
I, [2018-06-21T04:45:39.507447 #1905]  INFO -- : [53cc03e4-c93a-4572-b904-73acf7f9415e]   Rendered application.html.erb (1.3ms)
I, [2018-06-21T04:45:39.507770 #1905]  INFO -- : [53cc03e4-c93a-4572-b904-73acf7f9415e] Completed 200 OK in 2ms (Views: 2.0ms)

puma issue in production

I tried followings.

• bundle i
• yarn i
• rake assets:precompile
• export RAILS_ENV=production
• rake db:create
• rake db:migrate
• rake db:seed
• rails s

This gets this error
HTTP parse error, malformed request (): #<Puma::HttpParserError: Invalid HTTP format, parsing fails.>
Could you solve it?

Destroy method returning error

Thank you so much for this great example.

I noticed that destroying a musician causes this error:
500, there was an error on the server side :-(

Upgrade to Rails 6, newer versions of webpacker

Server-Side Rendering

Is there any way to set up a pre-rendering with this amazing SPA setup? SEO would be a great addition