【问题标题】：next.js video import vs reference - what is the next.js way to import videos?next.js 视频导入 vs 参考 - next.js 导入视频的方法是什么？
【发布时间】：2023-02-22 03:08:18
【问题描述】：
我在横幅内添加视频作为背景。
我使用的是 next.js，通常使用图像我会导入它们，然后将此导入作为 src 传递（例如，从 '@images/about-us-page/img.svg' 导入 img）。
目前，当我尝试对 mp4 视频执行相同操作时，它不会显示可导入文件中的文件。当我改用 require 时，它会抱怨需要配置 webpack。
导入视频的最佳性能方式是什么？那会是在公共场合创建视频目录然后只是引用吗？
图像的参考公众是否也是比导入图像更好的解决方案？
问候
【问题讨论】：
标签：
javascript
reactjs
webpack
video
next.js
【解决方案1】：
我知道这有点晚了，但为了将来参考......
Vercel 没有在他们的捆绑器配置中添加视频加载器，作为插件，故意的，因为托管大文件并且必须构建等等......会增加很多带宽使用。
因此，将资产托管在Cloudinary 或CDN 服务等云服务上并在需要时检索它们通常是一种很好的做法。
如果它是一个小的优化视频，你仍然可以导入它，将视频加载器添加到 next.config.js，这基本上是一个 webpack 插件：
https://github.com/jeremybarbet/next-videos