为什么我不能在我的项目中实现 React Helmet？

问题描述

我正在尝试找到将 <head> 实现到我的 React 应用程序中的最优雅的方式。想法是这样构造代码：

function App() {
  return (
    <div>
      <Head />
      <div className="App">
        <Header />
        <Body />
        <Footer />
      </div>
    </div>
  );
}

我的头：

import React from 'react';
import { Helmet } from 'react-helmet';

export const Head = () => {
    return (
        <Helmet>
            <Meta http-equiv="x-ua-compatible" content="ie=edge"/>
            <Meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/>
            <Meta name="format-detection" content="telephone=no"/>
            <Meta charset="utf-8"/>
            <Meta name="description" content=""/>
            <title>Timesheet APP</title>
            <Meta name="robots" content="noindex,nofollow"/>
            <Meta name="googlebot" content="noindex,nofollow"/>
            <link href="./favicon.ico" rel="icon" />
        </Helmet>
    )
}

但我不断收到错误消息：

./src/Head.js
Module not found: Can't resolve '..react-timesheet-app\node_modules\react-scripts\node_modules\babel-loader\lib\index.js' in '..react-timesheet-app'

首先，我的项目结构背后的想法是否正确？其次，为什么我不断收到错误消息？

编辑：添加了我的

我的 Package.json：

{
  "name": "react-timesheet-app","version": "0.1.0","private": true,"dependencies": {
    "@testing-library/jest-dom": "^5.11.4","@testing-library/react": "^11.1.0","@testing-library/user-event": "^12.1.10","react": "^17.0.1","react-dom": "^17.0.1","react-helmet": "^6.1.0","react-scripts": "4.0.2","web-vitals": "^1.0.1"
  },"scripts": {
    "start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"
  },"eslintConfig": {
    "extends": [
      "react-app","react-app/jest"
    ]
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  }
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

react-helmet reactjs reactjs