reactjs - マテリアル UI が JSPM で機能しない

Question

JSPM で React アドオンを使用できませんが、React 自体は動作しています。JSPM は次のエラーをスローします。

Potentially unhandled rejection [3] Error loading "react-addons-{addon}" at http://localhost:3000/react-addons-{addon}.js

プロジェクトで Material-UI を使用しようとすると、この問題が発生します。

Answer 1

基本的にはライブラリからそのファイルをロードするので、これはうまくimport React from 'react/lib/ReactWithAddons'いくと思いますが、Reactはそれらのアドオンを削除し、それらのためにいくつかのnpmパッケージを作成すると思います。理由は本当にわからないので、今のところ、これが少なくともあなたにとってうまくいくことを願っています.

詳しくは：

• https://github.com/facebook/react/issues/680
• https://github.com/facebook/react/issues/2909

Answer 2

この問題に遭遇したことはありませんが、別の問題があります。私のセットアップは次のとおりです。

• jspm
• ES6のバベル

1）マテリアルUIをインストールjspm install material-ui=npm:material-ui

2）これにより、次のようにマテリアルUIをReactコンポーネントファイルにインポートすることができました：import {TextField, LeftNav} from 'material-ui'

この時点で、ES6 ファイルへの適切な参照を取得したので、console.log(TextField); を実行すると 反応コンポーネントを印刷します。

悲しいことに、私の現在の問題は、jsx でコンポーネントを使用しようとするとエラーが発生することです。

   return (
     <div>
       <TextField />
     </div>
   ) 

エラーをスローします:

Warning: getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.
warning.js:17 Warning: Something is calling a React component directly. Use a factory or JSX instead. See: http://fb.me/react-legacyfactory
warning.js:26 Warning: TextField(...): No `render` method found on the returned component instance: you may have forgotten to define `render` in your component or you may have accidentally tried to render an element whose type is a function that isn't a React component.
warning.js:17 Warning: Don't set the props property of the component. Mutate the existing props object instead.
dashboard:1 Uncaught (in promise) Error: Can't add property context, object is not extensible
    Error loading http://localhost:3000/app.js
    at ReactCompositeComponentMixin.mountComponent 

たぶん、これは人々がこの問題を乗り越えるのに役立つでしょう。