1

试图在 plnkr.co 上获得一个非常基本的 react/jspm 示例，但它出现了许多 404 错误。最值得注意的是：

Uncaught (in promise) Error: XHR error (404 Not Found) loading https://npm.jspm.io/react-tools@0.13.3/vendor/fbtransform/visitors
    Error loading https://npm.jspm.io/react-tools@0.13.3/vendor/fbtransform/visitors as "./vendor/fbtransform/visitors" from https://npm.jspm.io/react-tools@0.13.3/main.js
    Error loading https://registry.jspm.io/js/app.jsx.js!https://registry.jspm.io/jsx.js
    at r (https://jspm.io/system@0.18.17.js:5:11565)
    at XMLHttpRequest.o.onreadystatechange (https://jspm.io/system@0.18.17.js:5:12090)

关于如何克服这些并让样本渲染的任何想法？

-->这里有问题plnkr.co示例<--

该代码也被复制到下面的代码片段中（显然它永远不会在这里工作，因为需要不同的 JSX 文件）只是为了那些不想去 plnkr.co 的 SO 读者。

// app.jsx
import React from 'react'
import Test from './test.jsx!'

React.render(
  <Test />
, document.getElementById('main')
);

//------------------------------
// test.jsx
import React from 'react'

export default React.createClass({
    displayName: 'Test'
  , render: function () {
      return (
        <div>Awesome Test!</div>
      )
    }
})

//------------------------------
//config.js
System.config({
});
<!-- index.html -->
<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div id="main"></div>
    <script src="https://jspm.io/system@0.18.17.js"></script>	
    <script type="text/javascript" src="config.js"></script>
    <script type="text/javascript">
      System.import('js/app.jsx!jsx')
    </script>
  </body>
</html>

4

1 回答 1

0

你有这些问题：

  1. index.html：System.import('js/app.jsx!jsx')应该是System.import('./app')

  2. app.jsx：import Test from './test.jsx!'应该是import Test from './test'

  3. 在 config.js 中缺少到您的库的映射：

    System.config({
  map: {
    "react": "npm:react@0.13.3"
  }
});

这是固定的plunker

于 2016-03-07T02:47:47.040 回答