使用来自以下方面的预构建组件:
我正在尝试构建导航栏,但收到以下错误:
Unhandled Runtime Error
TypeError: _camelize.default is not a function
http://localhost:8080/_snowpack/pkg/react-bootstrap.Navbar.v1.5.2.js [:41:55]
pascalCase@http://localhost:8080/_snowpack/pkg/react-bootstrap.Navbar.v1.5.2.js:41:55
createWithBsPrefix@http://localhost:8080/_snowpack/pkg/react-bootstrap.Navbar.v1.5.2.js:48:51
Navbar_1<@http://localhost:8080/_snowpack/pkg/react-bootstrap.Navbar.v1.5.2.js:603:50
createCommonjsModule@http://localhost:8080/_snowpack/pkg/react-bootstrap.v1.5.2/common/createChainedFunction-36b17a02.js:14:5
@http://localhost:8080/_snowpack/pkg/react-bootstrap.Navbar.v1.5.2.js:570:36
这不是第一次在这个项目中使用 react-bootstrap 组件 - 其他人工作得很好。问题开始于这些组件(Navbar 和 Nav)的使用。
据我所知,我的 index.jsx
中有所有必要的 JS(来自:https://react-bootstrap.github.io/getting-started/introduction/):
import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js';
import 'jquery/dist/jquery.min.js';
以及我的 index.html
中的必要脚本(来自:https://react-bootstrap.github.io/getting-started/introduction/#browser-globals):
<script src="https://unpkg.com/react/umd/react.production.min.js" crossorigin></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.production.min.js" crossorigin></script>
<script src="https://unpkg.com/react-bootstrap@next/dist/react-bootstrap.min.js" crossorigin </script>
<script>var Alert = ReactBootstrap.Alert;</script>
代码:
import React from 'react';
import '../src/App.css';
import Navbar from 'react-bootstrap/Navbar';
import Nav from 'react-bootstrap/Nav';
class Navigation extends React.Component {
constructor(props) {
super(props)
this.state={}
}
render () {
return (
<Navbar bg="dark" variant="dark" expand="lg">
<Navbar.Brand href='#home'>Text</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="mr-auto">
<Nav.Link href='#home'>Home</Nav.Link>
</Nav>
</Navbar.Collapse>
</Navbar>
)
};
}
所以我不知道这个错误发生在哪里?我是不是在某处遗漏了一个 js 文件?