小编Сла*_*нов的帖子

我正在尝试将 redux-persist 添加到我的 React 项目中（使用 typescript）。但我有一些麻烦。编译失败，出现以下错误：

Could not find a declaration file for module 'redux-persist/lib/storage'. '.../WebstormProjects/catalog/node_modules/redux-persist/lib/storage/index.js' implicitly has an 'any' type.
  Try `npm install @types/redux-persist` if it exists or add a new declaration (.d.ts) file containing `declare module 'redux-persist/lib/storage'

我安装了以下软件包：“@types/redux-persist”：“^4.3.1”和“redux-persist”：“^6.0.0”。

redux-persist/lib/storage 的内容：

declare module "redux-persist/es/storage" {
  import { WebStorage } from "redux-persist/es/types";

  const localStorage: WebStorage;
  export default localStorage;
}

declare module "redux-persist/lib/storage" {
  export * from "redux-persist/es/storage";
  export { default } from "redux-persist/es/storage";
}

怎么做才能解决这个问题？

添加到项目 ESLint 后出现错误：

错误：插件“react”在“.eslintrc.js”和“../.eslintrc”之间发生冲突。

我正在使用网络风暴。在 VSCode 中这工作得很好。

详细我可以看到：

Error: Plugin "react" was conflicted between ".eslintrc.js" and "../.eslintrc".
    at mergePlugins (/Users/account/Documents/web-km-client/node_modules/eslint/lib/cli-engine/config-array/config-array.js:202:19)
    at createConfig (/Users/account/Documents/web-km-client/node_modules/eslint/lib/cli-engine/config-array/config-array.js:305:9)
    at ConfigArray.extractConfig (/Users/account/Documents/web-km-client/node_modules/eslint/lib/cli-engine/config-array/config-array.js:481:33)
    at CLIEngine.isPathIgnored (/Users/account/Documents/web-km-client/node_modules/eslint/lib/cli-engine/cli-engine.js:954:18)
    at ESLintPlugin.invokeESLint (/Applications/WebStorm.app/Contents/plugins/JavaScriptLanguage/languageService/eslint/bin/eslint-plugin.js:100:23)
    at ESLintPlugin.getErrors (/Applications/WebStorm.app/Contents/plugins/JavaScriptLanguage/languageService/eslint/bin/eslint-plugin.js:78:21)
    at ESLintPlugin.onMessage (/Applications/WebStorm.app/Contents/plugins/JavaScriptLanguage/languageService/eslint/bin/eslint-plugin.js:52:64)
    at Interface.<anonymous> (/Applications/WebStorm.app/Contents/plugins/JavaScriptLanguage/jsLanguageServicesImpl/js-language-service.js:105:39)
    at Interface.emit (events.js:315:20)
    at Interface._onLine (readline.js:329:10)

我是新来的苗条。我尝试将 ESLint 添加到我的 svelte 项目中。我的 eslintrc.json：

{
  "env": {
    "es6": true,
    "browser": true,
    "node": true
  },
  "extends": [
    "standard", "airbnb-base/legacy"
  ],
  "plugins": [
    "svelte3"
  ],
  "overrides": [
    {
      "files": ["**/*.svelte"],
      "processor": "svelte3/svelte3"
    }
  ],
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaVersion": 2019,
    "sourceType": "module"
  }
} 

它可以工作，但 linter 规则不支持 sass 语法。我有这个错误。

我该如何修复它？

我已在 useEffect 中对功能组件做出反应。 https://codesandbox.io/s/nifty-dew-r2p1d?file=/src/App.tsx

const App = () => {
  const [data, setData] = useState<IJoke | undefined>(undefined);
  const [isLoading, setIsLoading] = useState<boolean>(true);

  useEffect(() => {
    axios
      .get("https://v2.jokeapi.dev/joke/Programming?type=single")
      .then((res: AxiosResponse<IJoke>) => {
        setData(res.data);
      })
      .catch((err) => console.log(err))
      .finally(() => setIsLoading(false));
  }, []);

  return (
    <div className="App">
      {isLoading ? (
        <h2>Loading...</h2>
      ) : (
        <div className="info">
          <div className="info__cat">
            {data?.category ? `category: ${data.category}` : "bad category"}
          </div>
          <div className="info__joke">
            {data?.joke ? `joke: ${data?.joke}` : "bad data"}
          </div>
        </div>
      )}
    </div>
  );
};

如何通过测试覆盖组件？我需要在请求之前、及时和之后测试状态。在这种情况下如何模拟请求？