問題タブ [react-boilerplate]

新しく生成された react-boilerplate プロジェクトに依存関係を追加するのに苦労しています。私はこのエラーに直面しています：

この依存関係を次のように package.json に追加した後:

app/containers/App/index.js などの既存の index.html

index.js から import ステートメントを削除すると、エラーは消えます。

何が起こっているのかわからないので、どんな提案でもいただければ幸いです。

詳細:

このリポジトリのクローンを作成し始めました:

https://github.com/mxstbr/react-boilerplate

次に、npm run setup を実行しました。次に、フェザークライアントに依存関係を追加すると、エラーが発生します。

request、feathers-rest、request-promise などの依存関係を追加すると、同様のエラーが発生することにも言及する必要があります。

bluebird などの依存関係を追加すると、エラーに直面しません。

このエラーが発生する依存関係の明確なパターンは見つかりませんでした。

css-modules を postcss-cssnext とともに使用しています 、特にその postcss-custom-properties 機能

また、react-boilerplate ( https://github.com/mxstbr/react-boilerplate/ ) も使用しています。この非常に優れたボイラープレートには、これらのモジュールが使用されています。

私のフォルダ構造は次のとおりです。

アプリ/styles.css

これらの vars を App/styles.css で使用したい (または、別の場所でそれらを定義してよろしいですか。その場合、どのようにすればよいでしょうか)。

私は試しました（css-modulesで使用するため）

ホームページ/index.js

HomePage/styles.css -- アプローチ 1

HomePage/styles.css -- アプローチ 2

最もエレガントなソリューションは何ですか? すべての変数を1つのファイル/1つの場所に配置し、すべてのcssファイルでそれらをうまく使用したい

variablespostcss-custom-properties https://github.com/postcss/postcss-custom-properties#variablesでも​​見ました。しかし、postcss-cssnext を使用する webpack 定義での使用方法がわかりません

webpack.dev.babe.js - ここに VARIABLES オプションを入れる方法

このテンプレートredux-formを使用してインストールし、レデューサーを接続して、redux devtools で正常に動作していることを確認しました。

入力中のアクション フローは良好ですが、キーストロークごとにフォームの値と入力が空になっていることがわかります。

コンソールにエラーはなく、手がかりも見つかりません。

小さな何かが欠けています。おそらくコンポーネントのレンダリングか、反応バージョンに関するものです...

私のパッケージ:

私のログインフォーム：

反応アイコンをインストールしてインポートしようとすると

import FaBeer from 'react-icons/fa/beer';エラーが発生する

インポートをimport FaBeer from 'react-icons/lib/fa/beer';次のように変更すると、

エラー メッセージを読んで、webpack の設定を変更する必要があることがわかりました。

だから私は除外ステートメントを変更しました

にexclude: /node_modules\/(?!(react-icon-base|react-icons)\/).*/,

そして今、私はできるimport FaBeer from 'react-icons/fa/beer';

ただし、レンダリングメソッドのように使用すると、エラーが発生します

warning.js:36Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method ofファビア.

では、どうやってビールを手に入れますか？

SO 私はreact-boilerplateを使用して React でユーザーの役割/権限の実装を実装しようとしています。ただし、ここで使用されるルーティングは、標準とは対照的に、何とか動的です。

<Router> <Route><Route> </Router>

フォーマット。

onEnterのこの機能を見てreact-router、同僚から、これはユーザーの役割に役立つ可能性があるとアドバイスされました。

それで、動的ルーティングを介してアクセスする方法があるかどうか疑問に思っていましたか? のルーティング コード スニペットからわかることから、react-boilerplateそれを宣言する方法はありません。

app/routes.js

PS。このreact-router-role-authorizationも見たことがありますが、現在のセットアップと統合できるかどうか疑問に思っていますreact-boilerplateか?

react-boilerplateの流れに慣れようとしています。私は今まで、物事がきちんときれいで分かりやすいことが大好きですが、パズルのピースが欠けていると感じています. より多くの経験を持つ誰かが私を助けてくれたらいいのにと思います。

私が現在直面している問題は次のとおりです。

• 特定のコンポーネントの componentWillMount() 内でアクションをトリガーしています。
• アクションは で作成されています。これは で作成されactions.jsた単純な get リクエストaxiosです。
• データは promise ミドルウェア ライブラリで処理されていますredux-promise。
• Promise は特定のコンポーネントのレデューサーに渡され、状態全体と必要なデータが返されます。
• コンポーネントでこの状態をキャッチしようとすると、失敗します。mapStateToProps を実行しようとしていますが、必要なデータが見つからず、代わりに Map {} が受信されています。

このオブジェクトを小道具にマップするにはどうすればよいですか?

私は何か重要なものを見逃していると確信しています。

これが私のレポです。 https://github.com/paschalidi/blog-react-redux

そして、ここに私のコードがあるので、簡単に見ることができます。

index.js

アクション.js

store.js

reducer.js

また、アクションはreducers.jsに登録されています