摆脱 CDN 包中的 Babel(StandAlone) 警告消息

IT技术 reactjs console babeljs warnings cdn
2022-07-24 23:45:00

我们在项目中的某些部分使用 React JS CDN。出于质量目的,我们希望向客户提供无警告代码。

我们正在使用以下库:

<script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
<script crossorigin src="https://unpkg.com/@babel/standalone/babel.min.js"></script>

问题是我们在控制台中收到以下警告消息:

您正在使用浏览器内的 Babel 转换器。确保为生产预编译脚本

我们知道这不是什么大问题,但我们确实想从我们的 Web 应用程序控制台中删除此警告。我们应该对代码进行任何更改,还是做其他事情?请指导,如何消除此警告信息。提前致谢。

1个回答

Babel Standalone 旨在成为在线调试和讨论代码的便捷工具(例如 Stack Snippets 中的 Stack Overflow 上),但它的工作方式非常低效——它是一个大包,并且将 JSX 转换为 JS 在浏览器占用了大量客户端资源。

对于生产站点,这里最好的方法是按照警告的建议进行操作,而是将 React 的 JSX 预编译为纯 JavaScript,以便您可以向客户端提供单个纯 JavaScript 文件。这样,代码只需在服务器端编译一次,而不是每次客户端加载页面时都在客户端编译一次。

为了轻松开始此过程,请考虑create-react-app您将需要 Node 和 NPM。

当您准备好部署到生产环境时,运行将在文件夹npm run build中创建应用程序的优化构建。build

然后你只需要提供服务,而不是让客户端依赖下载和解析 React、React DOM 和 Babel Standalone。