`craco start` 不编译，`craco build` 编译

Question

上下文

我最近使用 craco 将我的 CRA 词典应用程序切换到 Preact。我使用 webpack 别名完成了这项工作，它用 preact 包替换了对 react 包的引用（例如 preact/compat）。

当我运行...

时会发生什么

`craco build`

没有错误，构建成功完成，您可以在此处看到文件夹：

一切都很好。

`craco start`

它开始部署前检查（我认为），但很快就遇到了麻烦。它找不到反应模块。

$ yarn start
yarn run v1.22.17
$ craco start
craco:  *** Cannot find ESLint loader (eslint-loader). ***
E:\_Programming\js\Personal\dictionary-app\node_modules\react-scripts\scripts\start.js:19
  throw err;
  ^

Error: Cannot find module 'react'
Require stack:
- E:\_Programming\js\Personal\dictionary-app\node_modules\react-scripts\scripts\start.js
- E:\_Programming\js\Personal\dictionary-app\node_modules\@craco\craco\lib\cra.js
- E:\_Programming\js\Personal\dictionary-app\node_modules\@craco\craco\scripts\start.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.resolve (node:internal/modules/cjs/helpers:108:19)
    at Object.<anonymous> (E:\_Programming\js\Personal\dictionary-app\node_modules\react-scripts\scripts\start.js:52:31)
    at Module._compile (node:internal/modules/cjs/loader:1103:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at start (E:\_Programming\js\Personal\dictionary-app\node_modules\@craco\craco\lib\cra.js:202:5) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'E:\_Programming\js\Personal\dictionary-app\node_modules\react-scripts\scripts\start.js',
    'E:\_Programming\js\Personal\dictionary-app\node_modules\@craco\craco\lib\cra.js',
    'E:\_Programming\js\Personal\dictionary-app\node_modules\@craco\craco\scripts\start.js'
  ]
}
error Command failed with exit code 1.

现在当然不应该发生这种情况。我

在我的 tsconfig.json "skipLibCheck": true 中定义，它应该停止检查库，并且
向我的 craco.config.js 文件添加了 webpack 别名

module.exports = {
    webpack: {
        alias: {
            react: 'preact/compat',
            'react-dom/test-utils': 'preact/test-utils',
            'react-dom': 'preact/compat',
            'react/jsx-runtime': 'preact/jsx-runtime',
        },
    },
};

我不知道为什么这些别名适用于构建命令而不适用于启动命令。任何帮助将不胜感激。

代码和部署

Github repo

Vercel deployment

Answer 1

不幸的是，您需要保留 react 安装。 react-scripts 需要它来启动开发服务器，并且在不分叉包的情况下是不可避免的。

如果您担心与 React 一起使用的别名仍在安装中，您可以注释掉您的配置并比较构建大小。您应该会看到相当大的差异，确认您的别名按预期工作。

`craco start` 不编译，`craco build` 编译

`craco start` not compiling, `craco build` does

javascript

reactjs

preact

craco

上下文

当我运行...

`craco build`

`craco start`

代码和部署

`craco start` 不编译，`craco build` 编译

`craco start` not compiling, `craco build` does

javascript

reactjs

preact

craco

上下文

当我 运行...

craco build

craco start

代码和部署

当我运行...

`craco build`

`craco start`