Question

im new做出了反应，并正在尝试从在线导入npm模块。我使用npm install --save flag-icon-css安装软件包。似乎已正确安装，我现在在node_modules文件夹中有一个模块文件夹。但是，我收到以下错误./src/index.js Module not found: Can't resolve 'flag-icon-css' in 'C:\Users\Sean\OneDrive\Web Development\React\Projects\clock\src'。谁能向我解释我哪里出错了？

我的导入语句

  import React from 'react';
  import ReactDOM from 'react-dom';
  import ButtonClick from './Components/UserInputs.js';
  import Flags from 'flag-icon-css'

我在安装模块时也有这些警告

[npm WARN @typescript-eslint/eslint-plugin@1.6.0 requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN @typescript-eslint/parser@1.6.0 requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN @typescript-eslint/typescript-estree@1.6.0 requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN ts-pnp@1.1.2 requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN tsutils@3.14.0 requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\jest-haste-map\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.0.6 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.0.6: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})][1]

考虑到模块与react和react-dom位于同一文件夹中，我认为我可以使用相同的方法导入

这就是我找到软件包https://github.com/lipis/flag-icon-css

的地方

这是我的json文件

{
  "name": "clock",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "create-react-app": "^3.0.1",
    "flag-icon-css": "^3.3.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Answer 1

尝试import Flags from 'flag-icon-css'/flag-icon.min.css

Answer 2

删除package-lock.js和node_modules文件夹，然后运行npm install

通常，您在执行此操作时会非常小心，因为这会安装您可能没有设计系统的软件包的所有新发行版。但是，由于这是一个新项目，因此适合您。

无法将模块导入反应项目

2 个答案: