Javascript 在车把模板中包含js模块

我有以下文件：

server.js：

app.get('/main/:id', function(req, res) {
    res.render('main', { products: products });
})

main.hbs：

<div class="products">
    {{#each products }}
        {{ this.product_id }}
        {{ this.product_name }}
    {{/each}}
</div>


<script>
$(document).ready(function() {
    $(".add-to-cart").click(function() {
        const products = {
            item_id: $(this).attr('item_id'),
            item_name: $(this).attr('item_name'),
        }

        shopping_cart = new ShoppingCart();
        shopping_cart.addtoCart(products);
    })
})
</script>

<script src="../scripts/shopping_cart.js"></script>

我唯一的问题是，我试图在main.hbs文件中包含“购物车脚本”，但没有成功

起初我主要是这样做的。哈佛商学院：

<script src="../scripts/shopping_cart.js"></script>

但随后我在浏览器中发现了错误：“未捕获引用错误：未定义模块”

然后我尝试将其网页打包到bundle.js文件中： 我没有收到任何错误，但如果我单击“添加到购物车”按钮，我会得到： “未捕获引用错误：未定义ShoppingCart”

请帮助我理解如何包含shopping_cart.js文件并能够创建该类的新实例的正确方法

---

谢谢。

您遇到了一个非常典型的绊脚石，很多人在开始使用前端+后端js时都会遇到这个绊脚石

module.exports

是nodejs代码，它在浏览器中不起作用。您需要在普通JavaScript中编写

shopping\u cart.js

，而不使用nodejs函数和对象。在这种情况下，您应该能够简单地操作

module.exports

。但这感觉像是一个更大的困惑问题

您应该分别研究JavaScript和NodeJ，尤其是如果您对其中一个/两个都不熟悉的话。虽然有些组件可以共享，但它比简单的

模块要复杂一些。很遗憾，导出
。我建议您研究一些普通的前端（浏览器）首先是JavaScript教程，因为它没有诸如
module.exports
或
require（“…”）
之类的概念