时间戳

首页 > 解决方案 > 将外部 jsx 文件添加到 html 页面（反应）

javascript - 将外部 jsx 文件添加到 html 页面（反应）

问题描述

我在 js/script.js 中有一些反应代码 我的 HTML 页面的 head 标签看起来像这样：

  <head>
  <script src="https://unpkg.com/react@15.6.2/dist/react.js"></script>
    <script src="https://unpkg.com/react-dom@15.6.2/dist/react-dom.js"></script>
    <script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
    <script src="js/script.js"type="text/jsx"></script>
    </head>

出于某种原因，当我在 chrome 上打开页面时，我的反应元素没有显示，而在 Firefox 中则显示。我不想将页面限制为 Firefox，也不想使用内联脚本。有什么解决办法吗？

标签： javascripthtmlreactjsgoogle-chrome

解决方案

如果您直接从 Chrome 运行页面（不带 http），您的页面会尝试运行 javascript，而 Chrome 会阻止它并显示类似于以下内容的错误：“跨源请求仅支持协议方案：http、data、chrome、 chrome-extension, https, chrome-extension-resource”</p>

您应该安装一个 Web 服务器并通过 http 请求打开您的页面。命令字符串：npm install http-server -g 然后运行它：http-sever 'path/with/yourpage.html' 你的页面应该可以通过 URL 访问：localhost:8080/yourpage.html

推荐阅读