Question

我正在使用 webpack 和 typescript 构建一个 React 应用程序。我正在使用依赖项 react-financial-charts，它在 package.json 中正确指定，node_modules 中有以下两个文件夹：@react_financial_charts 和 react_financial_charts。

但是，当我在代码中使用该库并进行编译时，出现以下错误。

ERROR in ./node_modules/@react-financial-charts/utils/lib/index.js 2:0-27
Module not found: Error: Can't resolve './withSize' in 'C:\Users\Username\project\node_modules\@react-financial-charts\utils\lib'
Did you mean 'withSize.js'?

我检查了此错误消息中描述的文件夹，其中包含文件 withSize.js。什么给？

我的 webpack.config.js 包含这个：

  resolve: {
    extensions: [".tsx", ".ts", ".js"],
  },

我的 index.tsx 包含：

import React from "react";
import ReactDOM from "react-dom";
import Chart from "./StockChart"

ReactDOM.render(<Chart />, document.getElementById("root"));

其中 StockChart.tsx 驻留在同一目录中并从以下位置复制粘贴： https://github.com/reactivemarkets/react-financial-charts/blob/master/packages/stories/src/features/StockChart.tsx

我按照这些说明设置了 React+Webpack+Typescript 项目（请注意，我后来按照这些说明添加了 react-financial-charts 依赖项）：

https://www.newline.co/@bespoyasov/how-to-create-a-react-typescript-application-from-scratch--676bd120

Answer 1

已修复！

这个问题与https://github.com/webpack/webpack/issues/11467非常相似。

所以我只需要将它添加到 module（在 rules 和 { test: /\.m?js/, resolve: { fullySpecified: false } } 下）：

export const NavigationBar = () => (
  <Styles>
    <Navbar expand="lg" fixed="top" >
      <Navbar.Brand href="/">World Of Elrue</Navbar.Brand>
      <Navbar.Toggle aria-controls="basic-navbar-nav" />
      <Navbar.Collapse id="basic-navbar-nav">
        <Nav className="ml-auto">
        <Nav.Link href="/">Home</Nav.Link>
        <Nav.Link href="/about">About</Nav.Link>
        <Nav.Link href="/wallbreak">Wallbreak</Nav.Link>
        <Nav.Link href="/regions">Regions</Nav.Link>
          <NavDropdown alignRight title="Races" id="dropdown-menu-align-right">
            <NavDropdown.Item href="/races/Desc">Races General</NavDropdown.Item>
            <NavDropdown.Divider />
            <h6 align="center">Humanoid Races</h6>
            <NavDropdown.Divider />
            <NavDropdown.Item href="/races/Dwarves">Dwarves</NavDropdown.Item>
            <NavDropdown.Item href="/races/Humans">Humans</NavDropdown.Item>
            <NavDropdown.Item href="/races/Elves">Elves</NavDropdown.Item>
            <NavDropdown.Item href="/races/Gnomes">Gnomes</NavDropdown.Item>
            <NavDropdown.Item href="/races/Orcs">Orcs</NavDropdown.Item>
            <NavDropdown.Divider />
            <h6 align="center">Other Creatures</h6>
            <NavDropdown.Divider />
            <NavDropdown.Item href="/races/Other">Other</NavDropdown.Item>
          </NavDropdown>
        <AuthNav />
        </Nav>
      </Navbar.Collapse>
    </Navbar>
  </Styles>
)

未找到模块，您的意思是“*js”吗？

1 个答案: