如何使用 Webpack 别名 Preact?

问题描述

Preact 指南说

要为 webpack 中的任何包添加别名,您需要将 resolve.alias 部分添加到您的配置中。根据您使用的配置,此部分可能已经存在,但缺少 Preact 的别名。

但是使用任何官方模板(default、typescript、material web components 等)都不会生成任何 webpack.config.js 文件,并且 preact 没有像 react 这样的弹出命令来访问完整的项目配置。

解决方法

所以,有几件事:

首先,Preact 和 Preact-CLI 是两个独立的项目。

您引用了我们文档中标有“集成到现有管道”的部分。这意味着将 Preact 添加到您现有的 React 应用程序中。

如果您想添加 React 别名,我们在此处记录了如何操作:https://preactjs.com/guide/v10/getting-started#aliasing-in-webpack

但是,因为您提到了模板,而我们只有这些用于 Preact-CLI 的模板,所以我假设您正在使用这些模板。 Preact-CLI 不是“现有的管道”,因此它不属于该部分,并且作为官方 Preact 构建工具,已经带有这些别名!您无需执行任何操作即可获得它们。

preact 没有像 react 那样的弹出命令来访问完整的项目配置。

你在这里根本不是在谈论 React。 React 只是一个 UI 库。您所指的是创建 React App。有很大的不同。

我们确实允许用户configure their webpack build via a preact.config.js。这样做的方式是,您可以免费连接到我们现有的 Webpack 管道。您可以根据需要更改构建的任何部分,而无需拥有整个配置。只需简单地删除您的编辑(或您的 preact.config.js 文件),您就可以继续使用 vanilla Preact-CLI。没有“弹出”的概念,因为这对用户来说非常糟糕,并迫使他们拥有和维护大量配置只是为了进行小的编辑。我们允许您在不购买整个配置的情况下更改您需要的任何内容。