Error messages when NPM dependencies aren't met are not descriptive
isotiropoulos opened this issue · comments
User Story
I am trying to deploy a local instance of consuledemocracy and if fails with Sass::CompileError
Description
My system is an Ubuntu 22.04 and i use the following versions:
Rails v6.1.7.7
NodeJS v18.18.2
PSQL v14.11
Ruby v3.2.3
I have followed the steps for the local installation and although the server can be deployed (bin/rails server -b 0.0.0.0), when visiting localhost i get the following error
when i run bin/rails assets:precompile i get:
singular@euprojects: ~/consul/consuldemocracy$ bin/rails assets:precompile
rails aborted!
SassC::SyntaxError: Error: Can't find stylesheet to import. (SassC::SyntaxError)
╷
1 │ @import "sassc-embedded-import:19";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
sassc-embedded-import:18 1:9 @import
/home/singular/consul/consuldemocracy/app/assets/stylesheets/application.scss 10:9 root stylesheet
Caused by:
Sass::CompileError: Can't find stylesheet to import. (Sass::CompileError)
Tasks: TOP => assets:precompile
(See full trace by running task with --trace)
Current State
Seems to me that a stylesheet is missing but I can't find any information online
Hi, @isotiropoulos 😄.
Have you run npm install? It's possible that some of the assets installed by this command are missing 🤔.
I've just run into this issue locally, and solved it running npm install. @isotiropoulos Feel free to reopen the issue if this doesn't solve it 😉.
(merged from duplicate discussion #5574 (comment))
Hi @javierm!
I now have npm installed. I ran both npm install and bin\setup (in that order, my mistake), then started up the server again, and reloaded the localhost: still no success.
The procedure created a node_modules folder in my app home.
@jpprost Do you have a public/assets/ folder with compiled assets? If you do, what happens if you delete it and restart the server? If you don't, does the task rails assets:precompile crash as well?
no public\assets\, and yes, it does crash as well when I precompile the assets, with a similar output on stdout as previously:
rails aborted!
SassC::SyntaxError: Error: Can't find stylesheet to import. (SassC::SyntaxError)
╷
1 │ @import "sassc-embedded-import:273";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
sassc-embedded-import:272 1:9 @import
sassc-embedded-import:foundation_and_overrides.scss 10:9 @import
sassc-embedded-import:32 1:9 @import
/home/prost/LaREC/consuldemocracy/app/assets/stylesheets/application.scss 18:9 root stylesheet
Caused by:
Sass::CompileError: Can't find stylesheet to import. (Sass::CompileError)
Tasks: TOP => assets:precompile
(See full trace by running task with --trace)
Not sure what's going on 🤔. Since the error mentions foundation_and_overrides.scss 10:9 and line 10 in that file says @import "motion-ui/motion-ui";, could you confirm that the file node_modules/motion-ui/motion-ui.scss exists?
Another thing to try: remove the tmp/cache folder and try again (highly doubtful that'll work, but just in case).
One more thing to try: in the app/assets/stylesheets/foundation_and_overrides.scss file, comment (don't delete, so line numbers remain the same) lines 10, 49 and 50 (which are the lines referencing motion-ui. Then try to recompile the assets again and paste the error message (if you get one) to see whether the error trace is slightly different or remains the same.
Not sure what's going on 🤔. Since the error mentions
foundation_and_overrides.scss 10:9and line 10 in that file says@import "motion-ui/motion-ui";, could you confirm that the filenode_modules/motion-ui/motion-ui.scssexists?
It does not: the entire sub-fofder node_modules/motion-ui/ does not exist.
Another thing to try: remove the
tmp/cachefolder and try again (highly doubtful that'll work, but just in case).
It fails again, but with an extra line of warning comment, at the beginning:
W, [2024-06-11T05:47:31.417900 #185953] WARN -- : Removed sourceMappingURL comment for missing asset 'graphiql/rails/push-pull-async-iterable-iterator.esm.mjs.map' from /usr/share/rvm/gems/ruby-3.2.3/gems/graphiql-rails-1.8.0/app/assets/javascripts/graphiql/rails/graphiql-1.4.2.js
rails aborted!
SassC::SyntaxError: Error: Can't find stylesheet to import. (SassC::SyntaxError)
╷
1 │ @import "sassc-embedded-import:273";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
sassc-embedded-import:272 1:9 @import
sassc-embedded-import:foundation_and_overrides.scss 10:9 @import
sassc-embedded-import:32 1:9 @import
/home/prost/LaREC/consuldemocracy/app/assets/stylesheets/application.scss 18:9 root stylesheet
Caused by:
Sass::CompileError: Can't find stylesheet to import. (Sass::CompileError)
Tasks: TOP => assets:precompile
(See full trace by running task with --trace)
One more thing to try: in the
app/assets/stylesheets/foundation_and_overrides.scssfile, comment (don't delete, so line numbers remain the same) lines 10, 49 and 50 (which are the lines referencingmotion-ui. Then try to recompile the assets again and paste the error message (if you get one) to see whether the error trace is slightly different or remains the same.
Yep, it works! No error message, and the server loads up (apparently) fine. Haven't tested any use, though.
For information, the compilation ends up with a long series of INFO lines about writing files, then another long series of command-like lines, starting cp -p ....
Although the app looks like it is running, I take that it is incomplete? I'm happy to keep debugging if it helps back ;-)
the entire sub-fofder node_modules/motion-ui/ does not exist.
OK, this seems to be the issue. In my case, it happens sometimes when running npm install on a branch and then switching to a different branch; not sure why it's happened in your case 🤔.
Check that node_modules/motion-ui is referenced in your package-lock.json file, then run npm install and then check that the node_modules/motion-ui/ exists. If it doesn't (for whatever reason), remove the whole node_modules/ folder and run npm install again.
Then, remove the public/assets/ folder (if it exists) and start the application once more 🤞.
Check that
node_modules/motion-uiis referenced in yourpackage-lock.jsonfile,
It is not referenced.
then run
npm installand then check that thenode_modules/motion-ui/exists.
the folder still does not exist, even after running npm install.
If it doesn't (for whatever reason), remove the whole
node_modules/folder and runnpm installagain.
Then, remove thepublic/assets/folder (if it exists)
Ok. It did exist, and it's now removed.
and start the application once more 🤞.
Ok. The app runs, but I still can not find any node_modules/motion-ui/ folder. And no public/assets/ anymore.
Shall I run rails assets:precompile again? And keep the lines commented out in app/assets/stylesheets/foundation_and_overrides.scss?
It is not referenced.
Which branch are you using? 🤔 The master branch? The 2.1.1 tag? Any other?
The master one. No tags.
It occurs to me that for some reason the file package-lock.json shows modified when I run git status. Not sure why. It's dated from Sunday. If I restore the original (while keeping a copy of the current one), then I can find that "motion-ui" is referenced.
I'm afraid I can't tell where the changes come from. If I go through the recent history of our discussions, all I can find for Sunday is the following:
I now have
npminstalled. I ran bothnpm installandbin\setup(in that order, my mistake)
OK, so, after restoring the original package-lock.json, remove public/assets if it exists, run npm install and start the application. It should work 🤞.
I get a series of WARNING messages:
npm WARN foundation-sites@6.8.1 requires a peer of motion-ui@latest but none is installed. You must install peer dependencies yourself.
npm WARN foundation-sites@6.8.1 requires a peer of what-input@>=5.2.10 but none is installed. You must install peer dependencies yourself.
npm WARN consuldemocracy@ No repository field.
npm WARN consuldemocracy@ No license field.
The app runs seemingly correctly. But I'm not sure what to check anymore :-(
foundation-sites@6.8.1
I'm confused 🤔. The package-lock.json file in the master branch contains:
"node_modules/foundation-sites": {
"version": "6.7.5",
So I'm not sure why version 6.8.1is mentioned in the warnings. Do you have these lines as well in your package-lock.json?
Which versions of Node.js and NPM are you using, by the way?
Which version of Node.js and NPM are you using, by the way?
{ npm: '6.14.4',
ares: '1.15.0',
brotli: '1.0.7',
cldr: '36.1',
http_parser: '2.9.3',
icu: '66.1',
modules: '64',
napi: '5',
nghttp2: '1.40.0',
node: '10.19.0',
openssl: '1.1.1f',
tz: '2024a',
unicode: '13.0',
uv: '1.34.2',
v8: '6.8.275.32-node.55',
zlib: '1.2.11' }
Not sure if this is what's causing the issue 🤔, but the application requirements mention Node.js 18.18.2.
I'm not even sure I know how to check the version... Is it node: '10.19.0'?
Looks like it, yes.
I'm confused 🤔. The
package-lock.jsonfile in themasterbranch contains:"node_modules/foundation-sites": { "version": "6.7.5",So I'm not sure why version 6.8.1is mentioned in the warnings. Do you have these lines as well in your
package-lock.json?
Yes, that's exactly what I have:
"node_modules/foundation-sites": {
"version": "6.7.5"
Unfortunately we haven't updated the documentation regarding how to install Node.js on development yet. Personally, I use FNM because it's the one we use on production, but configuring the development environment to use the right version of Node.js (defined in the .node-version file) is tricky.
In any case, at this point we aren't even sure that the versions of Node.js and NPM are the reason why we're experiencing different behaviors.
Yes, that's exactly what I have:
"node_modules/foundation-sites": {
"version": "6.7.5"
OK, so, then, can you delete the node_modules folder and run npm install again? Then, check whether you're still getting the warnings about version 6.8.1.
OK, so, then, can you delete the
node_modulesfolder and runnpm installagain? Then, check whether you're still getting the warnings about version 6.8.1.
Only these two:
npm WARN consuldemocracy@ No repository field.
npm WARN consuldemocracy@ No license field.
And it modified package-lock.json: can not find node_modules or motion-ui anymore.
So, if I understand it correctly, after running npm install, you don't have a node_modules folder?
Oh, sorry, I forgot that node_modules is also a text in the package-lock.json file, and that's probably what you meant 🙏.
It looks like you're gonna have to install Node.js 18.18.2 and use the version of NPM included in Node.js 18.18.2 (which is NPM 9.8.1 IIRC).
So, if I understand it correctly, after running
npm install, you don't have anode_modulesfolder?
No: following your instructions, I first manually deleted the node_modules/ folder, then I ran npm install.
Oh, sorry, I forgot that
node_modulesis also a text in thepackage-lock.jsonfile, and that's probably what you meant 🙏.
No, don't worry, I got it right :-) I was just saying that running npm install modified my package-lock.json file: I don't know exactly what it did, but I observed that the file was modified by npm install (recall that I restored it a short while ago). When I realised that, I checked the new content, and could not find anymore the strings node_modules and motion_ui that we were looking for earlier on. It also explains why this file showed modified when I ran git status.
It looks like you're gonna have to install Node.js 18.18.2 and use the version of NPM included in Node.js 18.18.2 (which is NPM 9.8.1 IIRC).
Ok. I will look at it asap.
Hi again @javierm :-)
It looks like you're gonna have to install Node.js 18.18.2 and use the version of NPM included in Node.js 18.18.2 (which is NPM 9.8.1 IIRC).
Ok, done. And the server runs fine.
Now, should I run anything else, like recompile the assets?
And if I may, since we have been messing things around quite a bit, what would be a check-list, to ensure that my dev server install is sound?
For reference sake, here's what I did:
-
I keep alive my previous install of Node.js with apt (included in the prerequisites):
sudo apt install nodejs -y -
install curl:
sudo apt install curl -y -
Install Node Version Manager (NVM) (downloads the installation script,
piped to bash for execution):
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash -
Activate the NVM:
source ~/.bashrc -
Install Node v18.18.2:
nvm install 18.18.2 -
Make sure the default version is the wanted one:
nvm alias default 18.18.2 -
confirm the installed version:
node -v npm -v
should I run anything else, like recompile the assets?
Most of the time, when developing, yout should not precompile the assets. Doing so might be useful for testing/debugging purposes at certain points (that's why I asked you to do so), but, in general, make sure the public/assets/ folder does not exist on your machine.
The reason: when the public/assets/ folder exists, Rails will use whatever is there, so, if you've compiled the assets and then modified the code (or moved to a different branch, executed npm install, etc...), the changes you've done will be ignored.
what would be a check-list, to ensure that my dev server install is sound?
Everything seems OK 👌. If you can start a server and load the homepage and can also run a system test, you're fine.
Regarding Ruby dependencies, if you're using a ruby version manager (RVM, rbenv, ...) then you'll notice immediately if something is wrong (the server won't start, the tests won't run, and you'll get error messages with a proper description).
For Node packages, on the other hand, we've only started managing these dependencies with NPM in version 2.1.0 and the way we currently use it we don't get descriptive errors when something is wrong (like the "Can't find stylesheet to import" error in this issue). We still need to find ways to get errors like "Node.js 18.18.2 is not installed", "foundation-sites 6.7.5 not found; run npm install", ...
Currently the most common gotcha you can face during daily development is switching to a different branch that uses different node packages and forgetting to run npm install. I'm changing the title of this issue so it's clear this is what's happening.
Thank you so much, @javierm! You've been very patient and helpful. Much appreciated!
Now, I'll move on to the customisation of my own app. We'll see how it goes.