Skip to content

Instantly share code, notes, and snippets.

@binarygalwalkin
Last active February 10, 2022 01:51
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save binarygalwalkin/f2c0057153503c6985c15b2db715bfd8 to your computer and use it in GitHub Desktop.
Save binarygalwalkin/f2c0057153503c6985c15b2db715bfd8 to your computer and use it in GitHub Desktop.
//To load local resources in Chrome when just using your local computer and not using a webserver you need to add the
--allow-file-access-from-files flag.
//You can have a shortcut to Chrome that allows files access and one that does not.
//Create a shortcut for Chrome on the desktop, right click on shortcut, select properties. In the dialog box that opens
find the target for the short cut and add the parameter after chrome.exe leaving a space
eg C:\PATH TO\chrome.exe --allow-file-access-from-files
//This shortcut will allow access to files without affecting any other shortcut to Chrome you have.
//When you open Chrome with this shortcut it should allow local resources to be loaded using HTML5 and the filesystem api
//DOES Not work on Win10 in Powershell or Cmd
//You can do it by a feature of chrome's DevTools: Snippets
//Create a new snippets
//Copy and paste the file you would like to execute.
//Hit CtrlEnter to run the snippet
//Use Chrome browser and with the Web Server for Chrome extension, set a default folder and put your linked html/js files in there,
//browse to 127.0.0.1:8887 (0r whatever the port is set at) in Chrome and open the developers panel & console.
//You can then interact with your html/js scripts in the console.
//You can get it here chrome.google.com/webstore/detail/web-server-for-chrome/… and whatever default folder you set will be your
//web server, handy if you dont want to have to set up Apache or anything else.
file:///Users/someuser/dev/file.js
<html> <head> <script type = "text/javascript" src = "path/to/your/jsfile"></script></head></html>
<script type="text/javascript" src="../js/moment.js"></script>
//Here's the structure you need, based on your script tag's src, assuming you are trying to load moment.js into index.html:
// /js/moment.js
// /some-other-directory/index.html
//The ../ looks "up" at the "some-other-directory" folder level, finds the js folder next to it, and loads the moment.js inside.
//It sounds like your index.html is at root level, or nested even deeper.
//If you're still struggling, create a test.js file in the same location as index.html, and add a <script src="test.js"></script>
//and see if that loads. If that fails, check your syntax. Tested in Chrome 46.
//use VS Code Editor at code.visualstudio.com is to install the Live Server extension,
//then you don't need anything else at all, with your project folder (can be any folder)
//open in VS Code just right click on the HTML file (with linked js) in the explorer and
//select "open with live server", and browse to localhost:5500 and you can view output in
//browser and use chrome/firefox console.
//You can use a light weight webserver to serve the file.
//For example,
//1. install Node
//2. install the "http-server" (or similar) package
//3. Run the http-server package ( "http-server -c-1") from the folder where the script file is located
//4. Load the script from chrome console (run the following script on chrome console
var ele = document.createElement("script");
var scriptPath = "http://localhost:8080/{scriptfilename}.js" //verify the script path
ele.setAttribute("src",scriptPath);
document.head.appendChild(ele)
//Windows 8.1 add:
// --allow-file-access-from-files
//to the end of the target text box after the quotes.
//EX: "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment