Grails 3 Application Unable to load *.js file - javascript

I have my Grails 3 Application. I have placed my front-end application(which is built using Angular 2.1) in src/main/webapp folder.
While loading the application with URL http://localhost:8080/ I'm redirecting it to Index.html page.
But the Index.html page is not loading
URL:-http://localhost:8080/static/app-name/index.html
And I'm getting below errors in console.
GET http://localhost:8080/inline.js
index.html:14
GET http://localhost:8080/main.78fb007fcde8966a4e95.bundle.js
index.html:14
GET http://localhost:8080/styles.d63e17da56bb3a1ca523.bundle.js
index.html:14
GET http://localhost:8080/main.78fb007fcde8966a4e95.bundle.js 404 ()

Change it so resources don't get served from the /static url:
application.yml:
grails:
resources:
pattern: /**

Finally, I got the solution.
1.) Copied the contents of dist instead of dist folder itslef into src/main/webapp
2.)Made the changes in application.yml as suggested by #James Kleeh.
3.)Re-Route controller uri to index.html.
And here it goes.
PS: I was actually facing path issue which got resolved following above steps

Related

Next js serve static js files not working

I have this folder structure for my next.js project
/public
|static
-hello.png
|sample
-test.js
|charting_libray
|bundle
-dist.js
|hello.png
In my local environment
http://localhost:3000/static/hello.webp
http://localhost:3000/hello.webp
http://localhost:3000/static/sample/test.js
All of these works. This means JS, Image anything can be served from nested folders or directly from the public folder.
But when I build the project using next build command and deployed it to the production.
mydomain.com/static/hello.webp
mydomain.com/hello.webp
mydomain.com/static/sample/test.js
I have noticed only the images files can be accessed and the JS file returns 404.
My real-world use case is, inside a component I pass the path to a library like this
libraryPath: "/static/charting_library/"
I can see a net::ERR_ABORTED 404 error in the prod env browser console. Somehow the library works even with this 404 error.
But I need to know the reason for this 404 error and need to fix in the code.
Any help!
Thanks in advance.

Laravel files/folders not showing up in Public directory

I want to integrate TradingView's charting library in my Laravel project.
I have copied the charting_library folder to the Public folder of Laravel.
After that, I have referenced the charting_library.min.js file from Blade files in view and the other resources related to it.
<script type="text/javascript" src="{{ asset('tradingview/charting_library/charting_library.min.js') }}">
All js files loads successfully, but the problem is that this charting_library.min.js calls an HTML file from a subdirectory where it returns a 404 Not Found error.
http://localhost:8000/charting_library/static/fa-tv-chart.37***ee.html 404 (Not Found)
Here is the file/folder structure:
I have checked loaded resources from chrome's dev tools.
Laravel loads these referenced JS files, but it doesn't load any other files which these files have requested and just returns 404.
The charting_library folder exists in the directory, it's just something related to Laravel. I think it can't see the directory's contents.
I have tried to modify the .htaccess file but still no luck.
I even tried to mix charting_library.min.js via Webpack, changing autoload, but still, nothing happens.
I solved this issue by:
Moving the project to wamp's www folder.
Moving charting_library and datafeeds folder to the root of laravel's public. It seems
tradingview's widget constructor uses relative path's for building
whole chart. So when you place the charting_library inside a folder,
it doesn't resolve other assets. These folders should be exactly in
the root.

Overriding layout file Symfony (Aimeos Symfony Bundle)

I have a problem with overriding default template from app/Resources folder to my bundle resource folder. I have installed Aimeos Symfony bundle. And I get this error with opening list route. I moved all view files from app folder to bundle resource. Here is my folder structure project tree:
But i get this error trying to access /list route of Aimeos. I guess it has a wrong path main error:
Why are you "moved all view files from app folder to bundle resource"?
Please, carefully read the installation manual, especially this step - Symfony/Adapt base template.
So there was two ways how you got this error - you missed this installation step or just moved out app/Resources/view/base.html.twig that is important to see /list route.

serving static content in code structure generated by yeoman for angular fullstack

I am following the code structure generated by yeoman for angular fullstack.
I want to include a script called core.js in file called app.html.
<script src="core.js"></script>
I do not see express.static anywhere in this for serving static files.
I tried using it but it did not help.
It can not locate it and gives 404.
How do I get around this ?
It had happened before as well but I could get around it by using express.static and serving files from location pointed by it.
It did not help this time though.
Update:
I have app.html in folder called Music. In same folder, I have a sub folder called js where I have placed my core.js file that is to be included in app.html. I tried to access it using absolute as well as relative path but did not help and still gives 404.
In angular, the scripts go in the relevant subfolder of /scripts. Either in /controllers, /services/, /directives, etc. You then reference them in your html as such:
<script src="scripts/controllers/core.js"></script>
As for express.static, express is a NodeJS wrapper for HTTP. So that will be the service you create that lives on some Node server remotely. express.static allows the Node server to deliver static content files from the file set at the remote server. It does not go in your angular application.

angular js can't display bootstrap modal when relocate to another folder

I am using the bootstrap.ui modal and angular as the frontend, and using the node.js as the backend, in the node.js based server, I used /views folder for ejs template and public folder for storing static resources.
app.set('views',__dirname+'/views');
app.engine('.html', ejs.__express);
app.set('view engine', 'html');
app.use(express.static(__dirname+'/public'));
Previously my angular page is in the /public static folder, the modal works fine. but then I moved the angular page to the view folder, the page is loaded fine. but when it comes to the modal, the page can't display the modal, showing error
Error: [$compile:tpload] http://errors.angularjs.org/1.2.7/$compile/tpload?p0=template%2Fmodal%2Fwindow.html
http://errors.angularjs.org/1.2.7/$compile/tpload?p0=template%2Fmodal%2Fbackdrop.html
So the error is caused by the fact that template/modal/window.html and template/modal/backdrop.html are still in the public folder, that my angular page can't find these file again.
Now even I relocate the template folder from public to views, it still doesn't work, how can I fix this problem
I think that the problem comes from the hardwritten templateUrl in modal.js source code (see lines 64 & 86)?
There's a debate about this implementation: Github PR, Github issue.

Categories

Resources