search

foundation / foundation-rails

Foundation for Rails
foundation.zurb.com
MIT License
1k stars 376 forks source link

rails 6.0.0.rc2 install issues #281

Closed VinylVault closed 4 months ago

VinylVault commented 5 years ago

I'm having problems installing and configuring the foundation-rails gem on Rails6.0.0.rc2

$ rails g foundation:install
Running via Spring preloader in process 6943
      insert  app/assets/javascripts/application.coffee
The file /home/dex/RubyOnRails/vault-r6.1/app/assets/javascripts/application.coffee does not appear to exist
$

I'm not surprised that the file can not be found as the javascript folder has moved up a level so in my code extract the correct file location would be:

/home/dex/RubyOnRails/vault-r6.1/app/javascripts/application.coffee

Can anyone please advise how I can edit the install script to reflect the new paths? also coffeescript is being phased out

gczh commented 5 years ago

Facing the same issue here!

dylanesque commented 5 years ago

Also having this issue!

garrickvanburen commented 5 years ago

Also having this issue. I'm presuming the work-around is to load Foundation into the stylesheets & javascripts directories manually.

mikenewsletters commented 5 years ago

Same issue here too. Would welcome advice on how to get around this issue.

garrickvanburen commented 5 years ago

I was able to workaround by placing the css in the stylesheets dir, the js in the javascript dir and adding the appropriate markup to application.html.erb. Still need to fully test it, I'll update this thread w/ any hiccups.

mikenewsletters commented 5 years ago

I've figured out a solution (not a Gem expert so this is pretty "hacky" and will be brittle) ...

i) Find file (or equivalent location) : .rbenv/versions/2.6.3/lib/ruby/gems/2.6.0/gems/foundation-rails-6.5.3.0/lib/generators/foundation/install_generator.rb ii) Line 69, change "File.join("app", "assets", "javascripts")" to "File.join("app", "javascript", "packs")" (note the javascript[s] change)

Run "rails g foundation:install" ... hey presto!

mikenewsletters commented 4 years ago

ADDENDUM

So I tried to get Foundations 6's javascript goodness working in Rails 6.

Here's what eventually worked for me :-

i) Install JQuery (not via the gem) by following these steps -> https://www.botreetechnologies.com/blog/introducing-jquery-in-rails-6-using-webpacker

ii) Add "foundation.js" or "foundation.min.js" (in the Foundation downloaded zip file) into javascript/packs.

iii) Add "require("packs/foundation.js")" to applications.js in javascript/packs.

iv) Uncomment the following in "foundation_and_overrides.css" :-

(I also found that adding "$(function () { $(document).foundation();});" to application.js caused an error in the browser console, which I spent ages trying to fix, but just removing it doesn't seem to cause any side effects that I've seen yet).

Hopefully this is helpful to someone (or my future self when I forget this!).

benlieb commented 4 years ago

My first experience with foundation and this is what happens. I've been meaning to try it for a while. Sad :(

wanchic commented 4 years ago

I've figured out a solution (not a Gem expert so this is pretty "hacky" and will be brittle) ...

i) Find file (or equivalent location) : .rbenv/versions/2.6.3/lib/ruby/gems/2.6.0/gems/foundation-rails-6.5.3.0/lib/generators/foundation/install_generator.rb ii) Line 69, change "File.join("app", "assets", "javascripts")" to "File.join("app", "javascript", "packs")" (note the javascript[s] change)

Run "rails g foundation:install" ... hey presto!

I tried this with rails 6.0.2.1, I still get the similiar issues: ./app/javascripts/packs/application.coffee does not appear to exist

rgarner commented 4 years ago

I tried all of @mikenewsletters suggestions above. They were very helpful and got me past the foundation:install stage.

Later I came to needing the Dropdown JS component, and tried the @mikenewsletters addendum:

i) worked, got jQuery installed. ii) didn't; I ended up doing yarn add foundation-sites, which may yet see me stop using this gem ;)

The last part was pivotal:

(I also found that adding "$(function () { $(document).foundation();});" to application.js caused an error in the browser console, which I spent ages trying to fix, but just removing it doesn't seem to cause any side effects that I've seen yet).

If I didn't add the $(document).foundation(), the Foundation Dropdown wouldn't work, and it wasn't there as a function. So I found a post elsewhere that suggested using Foundation.addToJquery($). My application.js now looks like:

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

require("@rails/ujs").start()
require("jquery")
require("turbolinks").start()

import { Foundation, Dropdown } from 'foundation-sites';
Foundation.addToJquery($)

$(function(){ $(document).foundation(); });

... and the Dropdown finally works. This has cost me about a day, so I don't want to be all DenverCoder9 about it... HTH 😄

So now I've got a split-brained app, with foundation-rails doing Foundation's CSS through the asset pipeline and Webpacker doing Foundations JS through Webpacker. Which means I've got Foundation 6.6.1 installed twice, but hey ... things are working

autotelik commented 4 years ago

Still seems to be an issue. Is is best to ignore this gem completely and just try manually installing

roberthead commented 4 years ago

Day 286. This gem doesn't work with a fresh rails project. WTH?

ycrepeau commented 4 years ago

There is no elegant way to fix this issue.

The root problem is that Sprocket is in its last days. The announcement of its death (deprecation) is very close. In the mean time, everything is for the new kid in the block: webpack.

Writing generator with webpack in mind is a daunting task. There are no such thing as a "standard way" to achieve this. And by the way, there is always another config file to edit. What it is true today, 27th. of May of 2020, won't work anymore in 6 months, 1 or 2 years because some config file will be moved in another location, some loader will be replaced by another one and some extra info will be required in a very obscure configuration file located very deep in the /node_modules folder hiearchy.

Convention over configuration is not in the gene pool of Webpack or Node.

AquisTech commented 4 years ago

I have raised a PR #300 to fix this issue. Meanwhile before this PR approves and merges if someone want to use it or try it, can use it from my fork. gem 'foundation-rails', git: 'https://github.com/AquisTech/foundation-rails.git', branch: 'bugfix-281-fix-js-base-dir-for-install-generator'

arzvaak commented 3 years ago

Still a problem~~

Wusinho commented 3 years ago

I have raised a PR #300 to fix this issue. Meanwhile before this PR approves and merges if someone want to use it or try it, can use it from my fork. gem 'foundation-rails', git: 'https://github.com/AquisTech/foundation-rails.git', branch: 'bugfix-281-fix-js-base-dir-for-install-generator'

@AquisTech

image Im new in rails and I wanted to try foundation, is this correct?

ycrepeau commented 3 years ago

image Im new in rails and I wanted to try foundation, is this correct?

I have not tested this patch. But, according the output it looks ok. The best way to know for sure is to create a Test Rails project, add the patched foundation-rails gem and try to generate the basic file structure the same way the picture does. If it works without fuss, it perfectly OK.

If you plan to use foundation only for its stlylesheet part, it will be OK. If you also want to use the javascript components of foundation, you will need to test everything first, For instance, Foundation javascript uses jQuery ans jQuery is notoriously not compatible with Frontend technologies like Vuejs, React or Angular.

AquisTech commented 3 years ago

image Im new in rails and I wanted to try foundation, is this correct?

I have not tested this patch. But, according the output it looks ok. The best way to know for sure is to create a Test Rails project, add the patched foundation-rails gem and try to generate the basic file structure the same way the picture does. If it works without fuss, it perfectly OK.

If you plan to use foundation only for its stlylesheet part, it will be OK. If you also want to use the javascript components of foundation, you will need to test everything first, For instance, Foundation javascript uses jQuery ans jQuery is notoriously not compatible with Frontend technologies like Vuejs, React or Angular.

@ycrepeau @Wusinho Although I haven't got chance to write specs for the changes done in the PR, you can be sure about the changes as I am already using it in my running project.