我正在构建一个(非常复杂的)React应用程序(使用create-react-app
和TypeScript)。我也在使用React Router v4。大部分时间一切正常。
现在我使用了许多外部jQuery库,这些库不能与webpack一起使用(例如jquery.themepunch.tools.min.js,jquery.themepunch.revolution.min.js)。
因此,我在public/index.html
文件中使用<script>
标记在webpack之外加载我的jQuery和所有jQuery插件。 (我知道在使用create-react-app
应用程序时这不是推荐的方法,但我这样做是因为jQuery插件无法使用webpack)。
令人惊讶的是,除了这种特殊情况外,每件事情都可以正常工作: 每次我在浏览器搜索栏中输入一个至少有两个级别的URL时,应用程序崩溃。例如,这有效:
<Route path='/courses' component={<CourseListing />} />
而这不是:
<Route path='/courses/add-new' component={<CourseNew />} />
通过&#39;工作&#39;我的意思是相应的Route
组件正确呈现其内容。
当我输入此URL时,应用程序重新加载,但这次jQuery(我的应用程序通过<script>
标记引用)不会重新加载。每件事都因这个臭名昭着的错误而崩溃:
ReferenceError: jQuery is not defined
我知道崩溃肯定与我通过脚本标记(而不是node_modules中的ES6 npm版本)加载外部jQuery库有关。
但它主要起作用。我想了解的是为什么只有当我通过浏览器网址栏输入网址(有2个级别)时才会发生崩溃? React Router v4库可以与它有关吗?
我不想退出create-react-app
托管环境。
非常感谢社区向正确方向提出的任何意见。