問題タブ [react-toolbox]

React-Toolbox のデフォルトのスタイリングを正しく使用するにはどうすればよいですか?

このライブラリを試してみたいのですが、scss/css の設定に何時間も費やしました。react-toolbox コンポーネントをインポートしてレンダリングできますが、スタイルが設定されていません。public/index.html のタグを
使用すると、Roboto のフォントと素材が正常に機能します。<link>

簡単なインストール手順に従って、css-loader、sass-loader、babel を含めました。

https://github.com/react-toolbox/react-toolbox-exampleからサンプル プロジェクトをコピーしました。いくつかの場所にある style.scss などの余分なスタイル シートを削除して、簡素化して混乱を減らしました。サンプル プロジェクトにも含まれていることに気付きました<link rel="stylesheet" href="react-toolbox.css">(インストール手順、ドキュメント、または README には表示されません)。これ<link>は必須で、削除すると例のスタイルが解除されます。(サイド クエリ: css ファイルのビルド/提供を終了する方法と場所は? npm でローカルに提供した後でも、ディレクトリにはありません。)

そのため、index.jsx、package.json、および webpack.config.js のすべて/ほとんどを例からコピーし、その stylesheet を追加して<link>、ファイル名を例と構成に一致させました。

でコモンズをインポートしていimport 'react-toolbox/lib/commons'ます。

スタイルリンクとインポートは効果がないようです。実行時に npm/webpack からのエラーはありませんnpm start。同様の github の問題の 1 つに、同様の問題に対して webpack エラーがなかったことに驚きを表すコメントがあります。

[3] (コメントを参照) も試しましたが、それが何をするのかわかりません。そのポスターは、それが理想的ではないことを暗示していましたが、そのパターンは他では見たことがありません.

これはReact-toolbox のスタイルを正しく含める方法と重複する可能性があることを理解しています。私の担当者は低すぎてそこにコメントできません。その質問には現在回答がありません. 関連する問題がよく見られるため、コミュニティの回答が役立つことを願っています。

さまざまな問題では、通常は webpack の構成の問題にすぎないようです。もしそうなら、正しい構成が何であるかを知りたいです。どこかで 1 行かそこら抜けているか、React と Webpack を使用した最新のフロント エンドに関する単純な何かが欠けていると思われます。私はこれらのツールに不慣れです。

別のコンポーネント ライブラリをインポートする準備が整いましたが、比較して React-Toolbox について読んだことが好きで、モバイル フレンドリーなようで、少なくとも試してみたいと思います。

package.json: (名前、ライセンス、説明省略)

webpack.config.js:

index.jsx:

ここにあるreact-toolboxのTypeScript定義ファイルを更新しようとしています

いくつかのコンパイル エラーを修正した結果、次のようになりました。

/myproject/typings/main/definitions/react-toolbox/index.d.ts のエラー (1047,8): エラー TS2664: 拡張で無効なモジュール名、モジュール 'react-toolbox/lib/app_bar' が見つかりません。

の次のコードに関連しますdefinition file。

タイピングを使用して定義ファイルをインストールしました。typings.jsonファイルには次のものが含まれています。

tsconfig.json で exclude を使用し、自動的に検出されないため、npm install メソッドを使用しています。

tsconfig.json「ノード」モジュール解決を使用

node_modules 内のファイルを見つけることができるように消費プロジェクトを誤って構成したのか、これを達成する標準的な方法に準拠するように TypeScript 定義ファイルを変更する必要があるのか​​ はわかりません。プルリクエストを作成して更新できるように、標準的な方法でこれを実現したいと思います。

これらのモジュール宣言はすべて必要ですか、それとも簡略化できますか?

反応で子コンポーネントをレンダリングする際に問題が発生しています。スタイリングには React-Toolbox を使用しています。

以下のjsonファイルがあります

このファイルは、Project というコンポーネント内でレンダリングする必要があります

私の Project.jsx ファイルは以下です

理解できない理由により、CardActions コンポーネントがページにレンダリングされません。理由はわかりません。

反応を使用して簡単なサインアップフォームを設定し、onChange ハンドラーを使用して状態を更新しています。onChange ハンドラーによってキャッチされるイベント引数は文字列であり、オブジェクトではありません。

したがって、私はアクセスできないevent.target.valueか、イベントevent.target イベントは単に入力したキーワードを生成します

これは関連するスニペットです。

コンソールの私のエラー

入力フィールドは react-toolbox コンポーネントです