javascript - 要求/导入语句不起作用

Question

我无法将 semantic-ui-calendar npm 模块加载到我的应用程序中。

我已经使用脚本标签成功地将它加载到我的 HTML 中，

但每次我尝试将它加载到我的应用程序中时，我都会出错。

在标准的 HTML/JS/CSS 应用程序中，

我试过像这样将它加载到我的 index.js 中

var Semantic = require('semantic-ui-calendar');


$(function() {


  $('#example1')Semantic.calendar();

});

而且我总是收到这个错误:“未捕获的语法错误:意外的标识符”

我也试过将 require 语句放在“文档就绪”函数中，但无济于事。

我对是否可以为模块分配任意变量值感到有点困惑。

documentation没有指定命名空间，所以我只是使用语义作为我的变量名。我在这里错过了什么吗？

我怀疑的另一件事是，因为这个包使用 Bower 和 Gulp(我真的不知道这两个东西)，也许浏览器中需要这个包的协议(protocol)不同？

有人能指出我正确的方向吗？请谢谢!

Answer 1

问题是 require 实际上并不是浏览器实现的 vanilla js 的一部分。 Bower/gulp 以浏览器可以支持的方式添加它，但它也添加了一个额外的步骤，您必须为浏览器构建代码。

为了使用require，您需要使用添加它的构建工具，并在源代码上执行额外的构建步骤。

http://andy-carter.com/blog/a-beginners-guide-to-package-manager-bower-and-using-gulp-to-manage-components