导入 exif-js 库未捕获引用错误:EXIF 未定义错误

Question

我在rails应用程序中使用vue，并尝试将exif-js库导入我的脚本，以便访问全局EXIF变量以这样使用

var exif = EXIF.readFromBinaryFile(new BinaryFile(this.result));

我已经按照这些纱线说明下载了该软件包。

yarn add exif-js -- save

我意识到我需要使用 javascript 导入将其包含在我的脚本中并尝试过

<script>
import EXIF from 'exif-js'
previewPhoto() {
var reader = new FileReader()
reader.onload = () => {        
var exif = EXIF.readFromBinaryFile(new BinaryFile(this.result));
}
</script>

和其他差异，例如import 'exif-js'，但是我不断收到Uncaught ReferenceError: EXIF is not defined错误。如何成功导入库，以便可以在脚本中使用它。

Answer 1

你可以用 CommonJS 的方式使用它：

<script>
var EXIF = require('exif-js');
previewPhoto() {
var reader = new FileReader()
reader.onload = () => {        
var exif = EXIF.readFromBinaryFile(new BinaryFile(this.result));
}
}
</script>

Answer 2

import(如果你仔细查看你链接的 MDN 文章的顶部(目前没有得到大多数/所有浏览器的原生支持，尽管浏览器正在努力支持原生 es6 模块。 因此，如果您不使用webpack 或其他构建工具，则需要使用不同的方法。

您可以通过根 html 文档头部的脚本标记将exif-js库拖放到您的应用程序中：

<script src="https://unpkg.com/exif-js@2.2.1"></script>

解析文件后，全局EXIF变量将可用，您可以运行代码：

previewPhoto() {
var reader = new FileReader()
reader.onload = () => {        
var exif = EXIF.readFromBinaryFile(new BinaryFile(this.result));
}

请注意，胖箭头功能() =>也将具有有限的浏览器支持。