react 引入 jsx文件失败？

Question

我在学react，当用<script src="main.js"></script>的时候能引入js文件，但是jsx出错

我试着写成<script type="text/babel" src="main.js"></script>的时候报了以下错误信息
XMLhttpRequest cannot loat file:///D:/main.js

应该怎么分离jsx 和html文件呢，我用webpack的话也是怎么组织文档结构呢？

谢谢大神们回答

Answer 1

jsx 必须经过“编译”才能用。webpack的作用之一就是“编译”和打包。

文档结构嘛，GitHub 上有很多例子，但它们略有不同，似乎并没有一个强制的规范。比如 Redux 里的一些例子。

我最近正好也在研究这些东西，刚写了一个非常简单的东西，就一个 jsx 文件，然后用 webpack 打包成 bundle.js 并将其引用到一个 html 页面。这里需要用 npm 安装一些包。——现在的前端真的很麻烦……

Answer 2

使用webpack配置使用babel编译就可以了

Answer 3

chrome禁止了ajax的原因吧，改一下设置