react-scripts 3.0.0 更新后延迟加载时出现“模块解析失败”错误答案

【问题标题】：'Module parse failed' error while lazy loading after react-scripts 3.0.0 updatereact-scripts 3.0.0 更新后延迟加载时出现“模块解析失败”错误
【发布时间】：2019-09-21 03:12:25
【问题描述】：

我在我的 React 应用程序中延迟加载组件，并且一切正常。但是，在 react-scripts 3.0.0 更新后，我不断收到“模块解析失败：意外令牌”错误，如下所示：

./src/routes/App.js 22:9
Module parse failed: Unexpected token (22:9)
You may need an appropriate loader to handle this file type.
| import { Loader } from '../components/Preloaders/Loader';
| var ClippedDrawer = lazy(function () {
>   return import('../components/Drawer');
| });
| var Settings = lazy(function () {

这里是 App.js 文件的开头：

import React, { lazy, Suspense } from 'react';
import {
    Router,
    Route,
    Switch
} from 'react-router-dom';

import { Loader } from '../components/Preloaders/Loader';

const ClippedDrawer = lazy(() => import('../components/Drawer'));
const Settings = lazy(() => import('../containers/Settings/Settings'));
const NotFound = lazy(() => import('../containers/NotFound'));

这有什么问题，我该如何解决？

【问题讨论】：

标签： reactjs react-scripts

【解决方案1】：

找到解决方案：（但是，请备份您的项目，以防万一失败）。

删除node_modules
删除package-lock.json（不 package.json）

在终端：

运行npm install react-scripts@latest
运行npm install

访问https://github.com/facebook/create-react-app/issues/6673了解更多详情。

【讨论】：