is_january
is_january

Reputation: 57

error of loading react.js in chrome

I am new in React learning. I've just donwloaded Starter Kit 15.3.0 from this site: https://facebook.github.io/react/docs/getting-started.html

I'm using chrome browser. When trying to include a separate js file into html page like
https://facebook.github.io/react/docs/getting-started.html#separate-file
says, the chrome reports an error:

XMLHttpRequest cannot load file:///C:/Users/jxu200/Desktop/react-15.3.0/src/helloworld.js. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

I noticed that it is mentioned by react team that:

Note that some browsers (Chrome, e.g.) will fail to load the file unless it's served 
via HTTP.

my question is: why

react.js/react-dom.js/react-dom-server.js/react-with-addons.js,  

all js files in the /build folder can be loaded without a problem, but js files created by myself cannot be loaded normally ? even if I place my js file in the /build folder ? What does chrome actually do when loading react.js codes ?

Upvotes: 0

Views: 2712

Answers (1)

Majky
Majky

Reputation: 2013

You need some development server as pointed up in comments. You can use webpack for larger projects but for running just examples you should be fine with simple serve npm package.

  1. Install NodeJS
  2. Open node command prompt (or console if you are using Linux/OSX)
  3. Install npm serve package npm install -g serve
  4. From command line navigate to your starter kit folder and run serve command
  5. In browser navigate to http://localhost:3000/

Upvotes: 1

Related Questions