React - Модуль не найден: не удается разрешить '@ bootstrap -styled / v4' - PullRequest
Новая
       23

React - Модуль не найден: не удается разрешить '@ bootstrap -styled / v4'

0 голосов
/ 27 мая 2020

Интересно, почему React не может найти'@bootstrap-styled/v4'.

Сначала я не извлекал. Потому что это мой первый проект на React. Я хочу простого. 

yarn add '@bootstrap-styled/v4'

Итак, этот пакет установлен в'Project/node_modules/@bootstrap-styled/v4'.

И здесь файл package. json. 

# package.json
{
  "name": "front",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@bootstrap-styled/v4": "bootstrap-styled/v4",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.1",
    "styled-components": "^5.1.1"
  },
  "scripts": {
    "start": "cross-env NODE_PATH=src react-scripts start",
    "build": "cross-env NODE_PATH=src 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"
    ]
  },
  "devDependencies": {
    "cross-env": "^7.0.2"
  }
}


# src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import 'index.css';
import BaseLayout from 'BaseLayout';
import * as serviceWorker from 'serviceWorker';

ReactDOM.render(
  <React.StrictMode>
    <BaseLayout />
  </React.StrictMode>,
  document.getElementById('root')
);

serviceWorker.unregister();

# src/BaseLayout.js
import React, { useState } from 'react';
import {
    Nav,
    NavItem,
    NavLink,
    NavDropdown,
    DropdownToggle,
    DropdownMenu,
    DropdownItem,
} from '@bootstrap-styled/v4';

// root component
function BaseLayout() {
  const [isOpen, setIsOpen] = useState(false);

  return (
    <Nav>
      <NavItem>
        <NavLink href="">Home</NavLink>
      </NavItem>
      <NavDropdown isOpen={isOpen} toggle={() => setIsOpen(true)}>
        <DropdownToggle>
          General
        </DropdownToggle>
        <DropdownMenu>
          <DropdownItem>1</DropdownItem>
          <DropdownItem>2</DropdownItem>
          <DropdownItem>3</DropdownItem>
        </DropdownMenu>
      </NavDropdown>
    </Nav>
  );
}

export default BaseLayout;

Я запустил сервер, отображается ошибка.

Модуль не найден: не удается разрешить '@ bootstrap -styled / v4' в 'D: \ Project \ sr c '

У меня здесь несколько вопросов.

  1. Я слышал, если вы не извлекаете, проект React найдет модуль только в sr c. Это верно?

1-1. Если правильно, то я не понимаю. Тогда почему существует node_modules? Было бы правильно go внутри sr c, не так ли?

Что означает «@»? Это не ограниченный пакет, не так ли? Структура пакета с ограниченной областью видимости - @ scope / packageName. '@ bootstrap -styled / v4' не применяется. (По адресу https://bootstrap-styled.github.io/bootstrap-styled/ вы можете увидеть их пакеты.)
...