- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
在声明并完成所有配置文件后,当我启动服务器时,我得到 Buffer not defined 并且错误指向一个 npm 模块。 Uncaught ReferenceError :缓冲区未定义在 node_modules/jsesc/jsesc.js
最佳答案
您可以进行以下更改来解决此问题,在 vite.config.ts , index.html 中添加包
1.安装包
yarn add process util buffer events
yarn add @esbuild-plugins/node-modules-polyfill
2.更新vite.config
import GlobalPolyFill from "@esbuild-plugins/node-globals-polyfill";
import react from "@vitejs/plugin-react";
import { resolve } from "path";
import rollupNodePolyFill from "rollup-plugin-node-polyfills";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [react()],
optimizeDeps: {
esbuildOptions: {
define: {
global: "globalThis",
},
plugins: [
GlobalPolyFill({
process: true,
buffer: true,
}),
],
},
},
resolve: {
alias: {
process: "process/browser",
stream: "stream-browserify",
zlib: "browserify-zlib",
util: "util",
},
},
});
3.更新index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/src/assets/images/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title>
<script>
window.global = window;
</script>
<script type="module">
import process from "process";
import EventEmitter from "events";
import {Buffer} from "buffer";
window.Buffer = Buffer;
window.process = process;
window.EventEmitter = EventEmitter;
</script>
</head>
<body>
<div id="root"></div>
<script type="module" src="./src/index.js"></script>
</body>
</html>
关于reactjs - 从 CRA(create react app) 迁移到 vite 后,未定义缓冲区,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70354248/
我使用 CRA typescript 模板构建应用程序。 我在使用这段代码时,出现了解析错误。 export type { BaseModalProps } from "./BaseModalProp
我有一个使用 CRA 创建的 React 应用程序,它编译并运行良好。但是使用 yarn buld 制作并使用 serve -s build 提供的生产构建在控制台中显示以下错误: Uncaught
我正在尝试将 react-router 与 code splitting 一起使用在我的 create-react-app 应用程序中。 import loadSettings from 'bundl
我使用以下方法创建了一个 TypeScript React 应用程序: yarn create react-app my-app --template typescript 这样,我的项目编译为Bab
更新:我的用例主要是在 CI 上运行测试,但我通常想知道的是覆盖默认的 CRA Jest 参数。 我正在使用 Jest 运行测试, Create React App 附带的配置。它总是启动到交互模式:
我是Scrapy的新手,正在阅读教程。 跑了这个命令,出现了一些错误。 C:\Users\Sandra\Anaconda>scrapy shell 'http://scrapy.org' 特别是这个U
当使用 create-react-app 时,我的图片文件夹应该放在什么目录下? 在 src 或 public 中? 当我准备好运行 yarn build 时,一个或另一个会出现问题吗? 我听说只有放
所以我有这个带有多个页面的社交媒体应用程序,它都是通过创建带有上下文 api 的 react 应用程序和用于路由的 react-router 和用于后端的 laravel 创建的。现在,谷歌将无法索引
使用时 npx create-react-app appname , react-scripts安装的软件包包含一个 eslint 依赖项,其中包含“一组可查找常见错误的最小规则”。我想使用 pret
我正在使用react(使用create-react-app)创建一个Wordpress插件。我需要在不同的地方使用我的 React 应用程序,例如仪表板、用户配置文件、自定义管理页面、前端页面等。因此
我已经删除了 head 标签中的链接,但图标仍然被渲染,是否可以删除或更改? 最佳答案 您的网站图标位于project_root > public > favicon.ico。 | `--- publ
当我更新站点时,运行 npm run build 并将新文件上传到服务器,我仍在查看站点的旧版本。 没有 React,我可以看到带有缓存清除功能的网站的新版本。我这样做: 上一个文件 新文件 我怎
我有一个 CRA 应用程序,正在尝试使用 manual mocks Jest 的功能,但我的手动模拟似乎没有应用。 我使用 src 的基本网址(通过将其设置为 tsconfig.json )。简化,我
我想创建一个错误边界,以防止我的整个应用程序崩溃,而是通知用户出现问题并让他选择重新加载页面。我的错误边界组件: import React, { Fragment, PureComponent } f
我已经使用 create-react-app 创建了一个网站,现在由于 seo 的原因我想使用服务器端渲染。 经过长时间的研究,我发现了一个简单的工具 here . 它工作正常,但在我的代码中我有一个
我正在使用带有 typescript 和 enzyme 的 React 16,但 jest 没有读取我的适配器所在的 setupTests.ts 文件。如果我尝试在所有测试开始时配置适配器,它会工作,
我刚刚更新到最新的 create-react-app (web pack 5)。现在出现以下错误(我在这里只显示前 2 个错误)。任何帮助解释此错误的含义以及如何修复它的帮助将不胜感激。我认为问题不在
我在当前项目中不需要 PWA 功能。我怎样才能禁用它? 我阅读了CRA的文档,删除了src文件夹中的service-Worker.js,但我无法排除 list 文件和service-worker。 j
我安装了eslint-plugin-import-order并将其添加到 eslintConfig在 package.json . 我有错误: Definition for rule 'import/
我正在尝试将弹出的 create-react-app 迁移到 Webpack 5 并遇到此错误: Failed to compile. The "path" argument must be of t
我是一名优秀的程序员,十分优秀!