Not allowed to load local resource -error on chrome, Angular app is not running after production build
I am having a problem with the deployment of an angular app. It does not occur on another machine if deployed. My app is not running and it shows the following error on Chrome:
Not allowed to load local resource
and in Mozilla:
'src' attribute of element is not a valid URI
The thing is, it is working completely fine if deployed from other machines. So I am guessing the issue is with the versions of node or typescript or ng or whatsoever. I am new to server deployment and this kind of issue is new to me.
I am using following command to generate the deployment folder:
ng build --prod --base-href /candidate/
Following is my version details:
Node version: v10.16.3
Application typescirpt version: Version 2.9.2
Globally installed typescript version on the machine: Version 3.6.3
I deleted node modules and package-lock.json file and run npm install before production build. I got no error and was successfully able to generate dist folder.
The deployment folder works perfectly if it is deployed from machines which have upgraded or downgraded node version installed.
I have found many suggestions regarding the error shown on the browser, tried upgrading the node global versions but there is no way around. I am quite unsure about what I am missing here. Any kind of heads up would be great in this situation.
After digging into deep I found out that the problem is not with the version rather with the base URL it is generating in index.html file after build.
This issue occurs when using git-bash on Windows.
The git-bash sees the last argument of the command- ng build --prod --base-href /candidate/ as a path relative to its binary folder and prepends the argument with that (it converts the "seems-to-be" relative path into an absolute path).
So, I used PowerShell instead of Git-Bash and the issue was gone. The base-href parameter is handled fine there.
To resolve the issue with git-bash go through this link, which actually helped me to resolved my particular issue.
- Node.js recursive calls with q framework for multiple GET requests
- How to Decode and Verify OCSP Response in TypeScript with pkijs for Certificate Validation
- Firebase and Node.js application results in the requested URL was not found on this server for the firebase serve command
- Can I determine if a string is a MongoDB ObjectID?
- Husky add command is deprecated?
- Solidity compiler error loading specific function
- error could not determine Node.js install directory
- How can I sort an array?
- Make a link from Electron open in browser
- Prisma query engine not found on mac M1
- response.clearCookie() followed by response.cookie() leads to 2 same-name cookies
- Cannot read properties of undefined (reading 'statusCode') Nodejs using cheerio
- WebSocket connection to wss failed in production only(front end and back end on different domains)
- Puppeteer cant listen all request from paribu.com
- Disable deprecation in javascript console
- messaging.sendMulticast is not a function
- Node.js fs.readdir recursive directory search
- How to specify local registry in yarn?
- Handle Cors from lambda to cloudfront or s3
- Where can i see in amplify app the console log
- generate *.story.ts automatially when generating Angular component by cli
- Node.js native addons: where is node_api.h located?
- Errors building supergraph with Docker, Node.js, and Apollo's rover
- Postman POST call works Angular doesn't
- How to change console.log() output in VSCode?
- nodejs server create file name 4000, when server started
- Uncaught TypeError: PouchDB is not a constructor
- The difference between "require(x)" and "import x"
- Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object
- "npm run dev" Command Doesn't Work - Giving "missing script: dev" error