Sass error: no such file or directory, scandir 'node_modules/node-sass/vendor'


#1

Continuing the discussion from Self Hosting Vapid:

@Hadr619 reported:

I have gotten everything installed, got it run but when I run npm start I get what looks like webpack issues with the scss/css and js. Site shows up and I can access the admin and change text but currently no styles are showing for website or admin

And I suggested to try:

npm rebuild node-sass

But that didn’t work. I found this post on StackOverflow that had originally suggested the rebuild. One other commenter suggested deleteing node_modules entirely, and then running npm install again.


Self Hosting Vapid
#2

The errors above were resolved by installing
nodejs through nvm
instead of apt-get install nodejs,
but I am still getting the same issue with no scss compiling


#3

Oh, I misunderstood. So Webpack/Sass is no longer throwing the “no such file or directory” error? A few more follow-up questions:

  • Are you still not seeing dashboard styles? If so, what URL is it trying to load? e.g., http://localhost:3000/dashboard/stylesheets/dashboard.css
  • When you try and visit the stylesheet directly (either in the browser or via curl), what type of error are you getting: 404, 500?
  • What version of Node are you using?
  • Are you trying to deploy the default “Hello Vapid” site, or have you already customized your project?

#4

No worries, as you said everything started to get mixed in the last thread.

  1. I am seeing the dashboard styles, and am seeing the styles when I go to $DOMAIN$/dashboard/stylesheets/dashboard.css
  2. When I try to view $DOMAIN$/stylesheets/site.css I get a 404
  3. Node -v 10.11.0
  4. Currently trying to get the whole set up working using the “Hello Vapid” site.

#5

@Hadr619 Thanks for the info. Glad to hear you’re at least seeing the dashboard styles.

If you’re up for it, let’s try a few things:

  1. Stop the Vapid development server. Create an empty stylesheet (e.g., www/stylesheets/test.pack.scss). Start the server, then visit $DOMAIN$/stylesheets/test.css
  2. If #1 doesn’t work, try creating a standard, non-webpack stylesheet. (e.g., www/stylesheets/test2.css), and see if you’re able to view $DOMAIN$/stylesheets/test2.css
  3. If #1 does work, try emptying the contents of site.pack.scss, and see if you’re able to view $DOMAIN$/stylesheets/site.css

#6

@scott Curiouser and curiouser.
I tried all three and each one resulted in a 404.
I even created a new page.html and that is showing 404 as well, but this all works when I develop locally


#7

@Hadr619 If I may jump on this discussion, I don’t know much about how you were not able to get the styles to render, but what I have knowledge of is the error 404 that all your pages are having.

With my own experience, I found out that while trying to deploy vapid to Digital Ocean, I found out that the WWW folder was disabled using git/github. So what I resolved to do was use SCP. It’s an an FTP like app that lets you upload your files to digital ocean. When I used this method to upload my localhost pages, it worked for me.

So bottom line, check and confirm that the WWW folder is properly uploaded and working.

Hope that helps


#8

@Hadr619 Weird. Is Vapid being proxied behind Nginx or the like? Also, do you see Vapid logging the 404 requests?


#9

@seekersapp2013 Thanks for the response but thats how I originally uploaded the project too my droplet. I even did a vapid new test on the droplet so I know all the dir/ are there.

@scott After looking through everything I eventually checked my nginx server setup for that particular domain and when I comment out the try_files everything works fine, so at this point it looks all good. Styles are showing and even the uploaded Image I used is showing.Thank you so much for the response on the issue and I look forward to working with it as it seems exactly what my friend I have been wanting for quick SPA that clients could easily change images or text


#10

@Hadr619 Great! Glad to hear it worked out. Looking forward to seeing what you build.