React 開發常見報錯解決方法

1. 使用 redux 的異步 action 時瀏覽器報錯：

Error: Actions must be plain objects. Use custom middleware for async actions.

【原因】沒有添加 thunk 中間件

【解決方法】在入口文件中添加中間件，並在 createStore 時進行注冊：

import thunkMiddleware from 'redux-thunk'
const createStoreWithMiddleware = applyMiddleware(loggerMiddleware, thunkMiddleware)(createStore)

 

2. ant design pro 開啟 eslint 后出現大量 warning:

Line 1:  Definition for rule 'jsx-a11y/href-no-hash' was not 　　 jsx-a11y/href-no-hash

【原因】airbnb 的插件 jsx-a11y 暫時不能使用v6版本。

【解決方案】降低 eslint-plugin-jsx-a11y 版本為 5.1.0

npm install eslint-plugin-jsx-a11y@5.1.0 --save-dev

【注】

1. 在 antd pro 上提 issure，給的回復是 update eslint，嘗試過，無效。

2. google 上的解決方法是在 eslint 文件中添加規則：'jsx-a11y/href-no-hash': 'off' ，嘗試過，無效。 

3. 參考資料：eslint 結合webpack 在React環境下的使用