2017-06-14 4 views
0

ES5パッケージを最新の構文に書き直して、廃止の警告を避け、npmに公開しました。uglify.jsを発行せずにクラスであるReact ComponentをNPMに公開するにはどうすればいいですか?

next.jscreate-react-appに基づいたものを含むほとんどのリアクションプロジェクトは、uglify.jsを使用して、classというキーワードで壊れます。

{ Error: commons.js from UglifyJs 
Unexpected token: name 
... 

uglify.jsとnpmでクラスを使用するReactコンポーネントを正しく書き込むにはどうすればよいですか?あなたはまだ非推奨の警告を取得せずに、それを使用してコンポーネントを書きたい/必要がある場合

+0

クラスはUglifyJSによって解析されない機能なので、道のどこかでトランスバレーター(Babelなど)が必要です。あなたのNPMパッケージはあなたのモジュールの蒸散版を提供するか、あなたのReactプロジェクトはあなたのモジュールを透明化するべきです(それほど標準的ではありません) –

答えて

2

React.createClassyou can still use the now-separate create-react-class package instead次期バージョンでの主reactパッケージから削除されようとしているため、非推奨されてきたが。 「あなたのように - あなたはNPMに公開されるコンポーネントを書くことES6クラスを使用している場合


することは、あなたがするので予見可能な将来のためにNPMにES5コードを公開しているので、transpileステップを追加する必要があります。 ES6をサポートしていないツールが壊れてしまい、それらを使用するアプリケーションがES6クラスをネイティブにサポートしていないブラウザ(IE11など)に侵入する可能性があります。

既にバベルをJSXに変換するように設定している場合は、公開する前にクラスを遠隔操作する必要はありません。babel-preset-es2015プリセットをインストールしてBabel設定に追加してください。我々はツールとブラウザでES6のサポートはもはや問題である点に到達したとき、彼らはconstructor定型を紹介して


はしても、標準ES6クラスは、createClassに比べて部品に反応書くための非常に便利な方法ではありません手動のメソッドバインディングが必要で、propTypesのような静的プロパティを別途宣言する必要があります。

これを克服するための便利な機能(上記の例ではES6を使用しないReactコンポーネントの作成についての例もあります)には、提案された言語機能の実験的な実装(最も有用なものをカバーしています) Babelのプラグインを使用しているので、これらの機能を使用すると、とにかくコードを翻訳する必要があります。

関連する問題