使用JavaScript链接外部库时出现错误

Question

我通过npm安装了the color-convert library，但浏览器显示了一条错误消息

Uncaught ReferenceError: require is not defined home.js:134
at HTMLButtonElement.<anonymous> (home.js:134)
at HTMLButtonElement.dispatch (jquery-3.4.0.js:5233)
at HTMLButtonElement.elemData.handle (jquery-3.4.0.js:5040)

JS

var convert = require('color-convert'); // this is line 134
alert(convert.hex.lab('DEADBF'));

我认为路径有问题吗？

Answer 1

require()不是您的浏览器提供的功能，更多地表明此源代码是通用JS模块。

为了使用通用的JS模块，您首先需要通过捆绑源程序运行源代码，将每个require('other_module')替换为另一个模块的源代码，产生一个可以包含在您的前端HTML中的Javascript源文件。

捆绑器的两个示例是browserify和webpack。