couldn't find file 'material_icons' with type 'application/javascript'

[siaw23-retired]

With rails 4.2.5.1 and ruby 2.3 I get couldn't find file 'material_icons' with type 'application/javascript'. I am assuming application.css.erb goes in assets/stylesheets. I feel I have done everything to have this working but it's not working. Any ideas why?

[Angelmmiguel]

Hello @siaw23,

Yes, you need to add the following line to app/assets/stylesheets/application.css.erb:

//= require material_icons

I think you've added a similar line to app/assets/javascripts/application.js.erb and Rails is trying to read a javascript file.

[siaw23-retired]

Nope, I haven't. And actually after adding app/assets/stylesheets/application.css.erb the main CSS in my app vanishes. The assets are not loaded anymore.

[Angelmmiguel]

Ok, I will check the gem with your environment. Do you have the code of your application public?

[siaw23-retired]

ok i'll create a separate repo to recreate the problem in a couple of hours.

[Angelmmiguel]

Thank you @siaw23!

[siaw23-retired]

this branch has the problem: https://github.com/siaw23/twitter/tree/material_icon_problem

[mibamur]

Hello!

There are no problem )

you should use *= require material_icons instead //= require material_icons

app.js style

//= require this_is_for_js

app.css style

/*
*= require this_is_css
*/

app.css.erb used for some ruby code inside

[Angelmmiguel]

Hello @mibamur,

I added //= in README because Rails Assets documentation used this notation. I check it now and the notation is updated.

@siaw23, can you confirm this is problem?

Thanks!

[romaslmd]

HI,

@siaw23 Nope, I haven't. And actually after adding app/assets/stylesheets/application.css.erb the main CSS in my app vanishes. The assets are not loaded anymore.

problem described by @siaw23 related to rails asset rendering (default rendering).
there are two files application.css.erb and application.scss
and rails uses only one of them

Require file with //= within application.css also works but it better to use one syntax within file

[Angelmmiguel]

Ye @romaslmd, there are two files called application, but the error refers to a bad javascript include. I think Sprockets can try to load the first file as CSS asset and the second as JS ignoring the extension. This can be a bad behaviour of sprockets.

I will create a fork of @siaw23's project this evening (I'm out now), and rename the file application.scss to main.scss to test the error.

[siaw23-retired]

@Angelmmiguel ok cause it looks like this doesn't fix it and there could be lots of problems with different rails versions. currently not working for me still. the documentation could be better. i will try a workaround later this week.

[Angelmmiguel]

Yes, the documentation of Rails Assets changes with every new version of Sprockets

[Angelmmiguel]

I check with same ruby and rails versions and I can see the icons without modify any configuration in your project (see attached image).

Are you using a Linux distro or Mac OS @siaw23?

[siaw23-retired]

@Angelmmiguel i'm using a Mac. actually i got to this level. but is there an explanation why my bootstrap vanishes after successfully rendering the icons?

[Angelmmiguel]

@siaw23 have you got Material Icon font installed locally in your Mac OS?

[siaw23-retired]

@Angelmmiguel yeap ;)

[Angelmmiguel]

@siaw23 uninstall it and try, it can be the problem :)

[siaw23-retired]

@Angelmmiguel actually it wasn't installed locally, but it wasn't working. after local install still not working. i have a feeling it because we have 2 application files in the asset pipeline.

[Angelmmiguel]

Yes @siaw23, but I didn't get the error with these files. Please, check if renaming application.scss to main.scss solves the error in your environment.

[siaw23-retired]

no luck.

[romaslmd]

• This error couldn't find file 'material_icons' with type 'application/javascript' can only happen if //= require material_icons is placed in assets/javascripts/application.js file.
• Only one assets/stylesheets/application.((s?css|less|sass).*) must be in a directory, only one file will be used.

Don't forget to include all styles into application.css or javascripts into application.js.

try not to use .erb extension in assets without real need.

• Check ruby version manager (RVM or rbenv or whatever) for proper installation (no sudo or user added to sudoers) and ensure that app has access permissions to installed gems. (try to require gem in console manually and work with it for example)

Also try to create new project with different ruby/rails version and check if it works.

[Angelmmiguel]

Thanks for the summing-up @romaslmd. @siaw23 I think the next step is to create a new fresh installation too.

[siaw23-retired]

The README needs serious updating.

[Angelmmiguel]

There is an opened pull request to update CSS section in README. I will merge it this evening and finish the changes.

[romaslmd]

@siaw23
yep, but README file is just to show gem specification/info.
There is no such rule like you must do exactly as in this README
try to use README file to get some info about gem and use it in particular way
;-)

[Angelmmiguel]

I add some additional info in README and update the name of CSS standard application file, now its (app/assets/stylesheets/application.css)

[Angelmmiguel]

I will close this issue. If the problem appears in other environments I will reopen the case.

Thank you all for participating :)

[alexmiddeleer]

If you're just googling this error message, your problem might be as simple as forgetting to restart rails after installing this gem 😛

[Angelmmiguel]

hahaha the simplest solution is always the best 😂. Thanks for your comment @alexmiddeleer, I will add a section in the README.md.

[ghost]

hahaha the simplest solution is always the best . Thanks for your comment @alexmiddeleer, I will add a section in the README.md.

Server Restart, solved the problem