私はnpm
に入れたいJavaScriptライブラリをオーサリングしています。私は現在、別のプロジェクトでは、そのライブラリを使用していると私はそのGitHubのリポジトリを使用して、依存関係としてそれを追加しました:このファイルのコードを小さくできませんでした
"dependencies": {
// ... others
"react-web-component": "LukasBombach/react-web-component",
}
私もUglifyJsPlugin
とのWebPACKを使用しています。今私は私のプロジェクトをビルドするときにエラーが発生します:
Failed to compile.
Failed to minify the code from this file:
./packages/react-scripts/node_modules/react-web-component/src/index.js line 18:0
Read more here: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-build-fails-to-minify
error Command failed with exit code 1.
これは私のライブラリの問題です。私がdeps(そして私のコードから)を取り除くと、コンパイルが始まります。
私は問題が何であるかを把握することはできませんが、私のコードはかなりまっすぐ進むようだ:retargetEvents
とgetStyleElementsFromReactWebComponentStyleLoader
インサイド
const ReactDOM = require('react-dom');
const retargetEvents = require('./retargetEvents');
const getStyleElementsFromReactWebComponentStyleLoader = require('./getStyleElementsFromReactWebComponentStyleLoader');
module.exports = {
create: function(app, tagName, options) {
const proto = Object.create(HTMLElement.prototype, {
attachedCallback: {
value: function() {
const shadowRoot = this.createShadowRoot();
const mountPoint = document.createElement('div');
getStyleElementsFromReactWebComponentStyleLoader().forEach(style =>
shadowRoot.appendChild(style)
);
shadowRoot.appendChild(mountPoint);
ReactDOM.render(app, mountPoint);
retargetEvents(shadowRoot);
},
},
});
document.registerElement(tagName, { prototype: proto });
},
};
は、単純なmodule.export
コマンドがあるが必要です。ソースコードはhereとhereです。
私はすでにES6のエクスポート/インポートコマンドを使用してライブラリを公開しようとしました。
マイライブラリの完全なソースコードは、(それだけでこれらの3つのファイルです)私は解決策を見つけたhttps://github.com/LukasBombach/react-web-component
あなたは反応タグを追加するのを忘れました。 –
私があなたを正しく理解していれば、私はリアクションライブラリを必要としていないということです。それは問題ではない、私はここでそれを必要としない。 – Lukas
番号。反応コードがあるので、反応は私が不明なことをしなければならないと思う。はいの場合、タグの反応を追加すると、この質問を反応するdevsに持っていくのに役立ちます –