微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

从 CDN 加载 mobx-react 作为 UMD 时出错

如何解决从 CDN 加载 mobx-react 作为 UMD 时出错

自版本 6.0.0 起,从 CDN 加载 mobx-react 作为 UMD 会导致错误。有没有办法解决这个问题?

示例

const { observer } = mobxReact;

const App = observer(() => <div>Example</div>);

ReactDOM.render(<App />,document.getElementById("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.1/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.1/umd/react-dom.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mobx@6.0.4/dist/mobx.umd.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mobx-react@7.0.5/dist/mobxreact.umd.production.min.js"></script>

<div id="root"></div>

解决方法

6.0.0 版本开始,mobx-react 依赖于 mobx-react-lite 包,它在使用 observer 时用于函数组件。

如果您只在您的应用中使用函数组件,您可以根据需要直接使用 mobx-react-lite,它会更快更小(压缩后仅 1.5kB)。

示例

const { observer } = mobxReact;

const App = observer(() => <div>Example</div>);

ReactDOM.render(<App />,document.getElementById("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.1/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.1/umd/react-dom.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mobx@6.0.4/dist/mobx.umd.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mobx-react-lite@3.1.6/dist/mobxreactlite.umd.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mobx-react@7.0.5/dist/mobxreact.umd.production.min.js"></script>

<div id="root"></div>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。