Famo.us grunt serve gives blank browser - gruntjs

Trying to start playing with the Famo.us example. I followed the steps on the Github page and when I do "grunt serve" the browser opens up but with the following errors:
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:1337/lib/famous-polyfills/functionPrototypeBind.js
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:1337/lib/famous-polyfills/classList.js
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:1337/lib/famous/core/famous.css
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:1337/lib/famous-polyfills/requestAnimationFrame.js
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:1337/lib/requirejs/require.js
Running it on Windows 7 with Chrome. Any idea how to solve this?

Have you tried running "bower install"? All of those dependencies should be installed by default via bower when you run 'yo famous', but I have seen some instances where it does not.
I would ignore the above advice about cloning via github, there are other dependencies including require.js and almond that would not be installed using that method
Also, as far as minified version is concerned... if you run the "grunt" command you will have a minified, cache busted version of all your dependencies roll for you via require.js / almond. This is better than simply having a minified version of the library as it will only link in modules used.
FWIW I am the author of the tool :D

Based on your comment.. If those files do not exist, you need to make them exist. It is strange the files were not created using the ToolBelt.
Just go to github and grab the files you are missing.
famous/core : https://github.com/Famous/core
famous-polyfills : https://github.com/Famous/polyfills
requirejs: https://github.com/Famous/examples/tree/master/src/lib
** EDIT **
The Author of this tool has submitted a better answer.. Please read TheAlphNerd's response.

Related

Next.js example takes a long time to compile due to Inter google fonts

I'm trying with the trivial next.js example blog from their tutorial. However, when I access the page, I get the following situation:
$ npm run dev
> nextjs-blog#0.1.0 dev /Users/<redacted>/tmp/nextjs-blog
> next dev
ready - started server on 0.0.0.0:3000, URL: http://localhost:3000
event - compiled client and server successfully in 386 ms (165 modules)
wait - compiling /_error (client and server)...
event - compiled client and server successfully in 91 ms (166 modules)
warn - Fast Refresh had to perform a full reload due to a runtime error.
wait - compiling / (client and server)...
error - Failed to download `Inter` from Google Fonts. Using fallback font instead.
event - compiled client and server successfully in 152.9s (195 modules)
error - Failed to download `Inter` from Google Fonts. Using fallback font instead.
warn - Fast Refresh had to perform a full reload due to a runtime error.
I am not sure why it hangs for two minutes and why it can't download the google fonts. I am behind a proxy, so I suspect that could be a factor, but I cannot find anything on how to set up a proxy for next.js in the configuration (assuming the actual problem is that).
Note that HTTP_PROXY and HTTPS_PROXY are set correctly.
I'm running with these:
"next": "13.0.7"
npx create-next-app#latest nextjs-blog --use-npm --example
GitHub Link
I tried as suggested to run npm run build, and I get the following:
$ npm run build
> nextjs-blog#0.1.0 build /Users/xxx/tmp/nextjs-blog
> next build
info - Linting and checking validity of types
info - Creating an optimized production build
Failed to compile.
pages/index.tsx
`#next/font` error:
Failed to fetch `Inter` from Google Fonts.
> Build failed because of webpack errors
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! nextjs-blog#0.1.0 build: `next build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the nextjs-blog#0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
The logs file does not give more info than this.
Same issue, I suspect it's because #next/font doesn't respect HTTPS_PROXY
environment variable. It's really frustrating for a new user (behind a proxy) who read the fantastic docs but cannot even run a minimal create-next-app project (at least the default index.js).
I Disconnected with the VPN and it solved this problem.
some solutions
solution 1
just remove the #next/font/google module, if you don't need it.
import Head from 'next/head'
import Image from 'next/image'
- import { Inter } from '#next/font/google'
import styles from '#/styles/Home.module.css'
- const inter = Inter({ subsets: ['latin'] })
solution 2
if you are using a VPN, quit your VPN and try it again.
As #ashwani-panwar suggested.
It works for me.
refs
https://github.com/vercel/next.js/discussions/46012
I had this same issue, but I wasn't behind a proxy, after a lot of code testing I discovered the fault was from #next/font/google, it stuck on compiling /page and didn't show an error. A temporary solution I found is to use a VPN service to change your IP address, there seems to be a network request issue when Next gets the fonts from the server.
Update
visiting https://fonts.google.com seems to indicate whether the issue is from Google's servers or something else, if #next/font/google is causing a slowdown visiting the fonts page ussually hangs too.

How to deploy React three fiber app that has a .gltf model?

I created a website using "create react app" and I have a model.gltf in my "public" folder, when I run npm run deploy it creates a "build" folder that has the model.gltf inside it but the github page throws:
On ChromeFailed to load resource: the server responded with a status of 404
On Firefox XHR GET https://marinakhamis.github.io/model.gltf [HTTP/2 404 Not Found 69ms]
P.S: I refer to Marina_model_stand_draco as model.gltf for simplicity
Here's the link to my repo https://github.com/marinakhamis/three-app
model.js file (Auto-generated by: https://github.com/pmndrs/gltfjsx)
package.json
folder structure

Wordpress: Issue registering/enqueueing style sheet

New to wordpress and I can't get stylesheets to load in my plugin. Either that or thier effects are being overridden. This is what I have in my main plugin.php file:
function load_pc_scripts() {
wp_register_style('plugin-style', plugin_dir_url(__FILE__) . 'plugin-style.css');
wp_enqueue_style('plugin-style');
}
add_action('wp_enqueue_scripts', 'load_pc_scripts');
The style sheet is in the same directory but console shows this:
plugin-style.css:1 Failed to load resource: the server responded with a status of 404 (Not Found)
load-scripts.php?c=0&load[]=jquery-core,jquery-migrate,utils&ver=5.1.1:8 JQMIGRATE: Migrate is installed, version 1.4.1
plugin-style.css:1 Failed to load resource: the server responded with a status of 404 (Not Found)
options-general.php?page=price-compare-settings:1 Unchecked runtime.lastError: The message port closed before a response was received.
plugin-style.css:1 Failed to load resource: the server responded with a status of 404 (Not Found)
If the console is showing a 404 then enqueue is working, you likely have a typo in the file name or party in one place or another

Why can't I load js and css when using hexo publish blog

I want to use hexo to public my blog on github.I can get my webpage using localhost:4000 but after deployed to github.I can only get page with words but js and css can't be loaded.
here is the error message from chrome console
http://rudy-zhang.github.io/css/style.css Failed to load resource: the server responded with a status of 404 (Not Found)
There is no content in css file but I can find content in the files of repository.
When I install hexo I get warning
> $ npm install hexo -g
npm WARN optional dep failed, continuing fsevents#0.3.5
|
> dtrace-provider#0.4.0 install C:\Users\Rudy\AppData\Roaming\npm\node_modules\h
exo\node_modules\bunyan\node_modules\dtrace-provider
> node scripts/install.js npm WARN optional dep failed, continuing fsevents#0.3.0
I'm not familiar with nodejs so I don't know if it's the place something wrong.
How can I fix this problem?
Maybe hexo2.8 is a good choose.
I had the same problem,cause I changed the themes's css style.And then I back to hexo2.8,the problem missing.
npm install hexo#2.8 -g

Unable to load another page in JHipster on Production

I have an issue with the Pprod profile. I have created two pages: index.html and profile.html
When I run the project with production profile then the index page is working fine for me. I.e. it converts all CSS, JS and replaces all HTML with the new URL.
If I replace profile.html with index.html then again it is all working fine for me. I.e. it converts all CSS, JS and replaces all HTML with the new URL.
But, if I run both pages simultaneously, then only index.html is working fine for me and profile.html is not.
On profile.html page HTML, the URL is not changed with script.js and main.css file.
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/styles/postLogin.css
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/scripts/profile.js
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/scripts/main.js
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/scripts/profile/app/app.js
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/scripts/profile/directive/profile-directive.js
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/scripts/profile/controller/profile-controller.js
Failed to load resource: the server responded with a status of 404 (Not Found) abc.com/scripts/profile/service/profile-service.js
Any ideas?
Thanks in advance.
First you need to upgrade to our latest 0.8.3 version, which I just released 2 minutes ago. It fixes several issues in "production" mode, which probably affect you:
http://jhipster.github.io/2014/01/29/jhipster-release-0.8.3.html
Secondly, your main problem is that JHipster is designed to create a "single page" webapp, so obviously if you have two Web pages you will have some minor trouble. The only thing you need to do, AFAIK, is to add your file to the WebConfigurer.initStaticResourcesProductionFilter class, just after the "/index.html" line:
staticResourcesProductionFilter.addMappingForUrlPatterns(disps, true, "/profile.html");
That way your file will be served by the "production" filter.

Resources