Question

我想知道为什么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;

我运行服务器，显示错误。

未找到模块：无法在'D：\ Project \ src'中解析'@ bootstrap-styled / v4'

我在这里有几个问题。

我听说如果您不弹出，React项目将仅在src中找到模块。是吗？

1-1。如果正确的话，我没有任何意义。那为什么node_modules存在呢？进入src是正确的，对吧？

“ @”是什么意思？这不是有作用域的程序包，对吗？原因作用域包的结构是@ scope / packageName。 '@ bootstrap-styled / v4'不适用。（在https://bootstrap-styled.github.io/bootstrap-styled/，您可以看到他们的包裹。）

反应-找不到模块：无法解析'@ bootstrap-styled / v4'

0 个答案: