Javascript 与CodePen完全相同的代码不工作-MDC未定义错误

我从Codepen复制了这段代码。然而，在我的控制台中，我可以看到一个“mdc未定义”错误，即使我正在使用所需的Javascript进行链接。这件事我哪里做错了

src=”https://unpkg.com/material-components-web@最新/dist/material components web.min.js“
//实例化MDC抽屉
const drawerEl=document.querySelector（'.mdc drawer'）；
const drawer=新的mdc.drawer.MDCDrawer.attachTo（drawerrel）；
//实例化MDC顶部应用程序栏（必需）
const-topAppBarEl=document.querySelector（'.mdc-top-app-bar'）；
const topAppBar=new mdc.topAppBar.MDCTopAppBar.attachTo（topAppBarEl）；
setScrollTarget（document.querySelector（'.main content'）；
topAppBar.listen（'MDCTopAppBar:nav'，（）=>{
drawer.open=！drawer.open；
});
菜单

单击菜单按钮
在页面左上角切换抽屉

脚本注入有问题

<script>src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"</script>

src=”https://unpkg.com/material-components-web@最新/dist/material components web.min.js“

它应该是

<script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script>

---

脚本注入有问题

<script>src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"</script>

src=”https://unpkg.com/material-components-web@最新/dist/material components web.min.js“

它应该是

<script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script>

不，我只是在使用html和css

src=“http…

您的脚本标记有输入错误。您在错误的位置添加了一个

，在src属性过早结束该标记之前。它应该在最后一个

”

之后，因此不会加载库文件。在这之后，您会遇到这个问题，因为您过早地运行代码。不，我只是在使用html和css

src=“http…

您的脚本标记有一个拼写错误。您在错误的位置添加了一个

，在src属性过早结束该标记之前。它应该在最后一个

之后。”

因此，不会加载库文件。在这之后，您会遇到这个问题，因为您过早地运行代码。TML头块先执行，然后是体块。如果您获得/设置了任何元素，那么这就是问题所在，您最好在底部或文档完成事件之后添加JS代码（如果您想在头中执行一些代码）HTML头块先执行，然后执行体块，如果您获取/设置了任何元素，这将是问题所在，最好在底部或文档完成事件之后添加JS代码（如果您想在头中执行一些代码）