[SOLVED] Cannot load modules with traceur - tries to access file via xhr

Cannot load modules with traceur - tries to access file via xhr

I am trying to use traceur. When I want to load a module though, I get an error that it was unsuccessful. My code is based on the example traceur provided in its documentation on modules.

Here is the main.html:

<script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script>
<script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script>
<script>
     System.traceurOptions = { experimental: true } 
</script>

<script type="module" src="ProfileView.js"></script>

And the loaded module:

// ProfileView.js
import {firstName, lastName, year} from './Profile.js';

function setHeader(element) {
  element.textContent = firstName + ' ' + lastName;
}
// rest of module

// Profile.js
export var firstName = 'David';
export var lastName = 'Belle';
export var year = 1973;

I get the following error in Chrome:

XMLHttpRequest cannot load file:///C:/Code/Tests/Traceur/ProfileView.js. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

WebPageTranscoder FAILED to load file:///C:/Code/Tests/Traceur/ProfileView.js

Uncaught NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'file:///C:/Code/Tests/Traceur/ProfileView.js'.

I know that you cant make xhr-requests via the file system but I have seen some tutorials in which the code is structured similarly to mine and it works there...

What may I be doing wrong?

Solution

You cannot access the file system with xhr, you should open those pages over http by running a local webserver. If you really want to enable file system access you can: http://www.chrome-allow-file-access-from-file.com/

I.e. you start chrome chrome.exe --allow-file-access-from-files