☰

如何在没有 NPM 的情况下使用 Material Design 3 web？

tag-icon • tag-icon html web-development web-design
如何在没有 NPM 的情况下使用 Material Design 3 web？

我已经使用 Material Design Lite (1.3) 很长时间了。现在我想使用 Material Design 3。（使用此代码，它仍然是 Material Design 1.3）。

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.orange-yellow.min.css">
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>

但我使用的 Chromebook 带有管理员锁。因此无法构建 Material Design 3。

答案1

您可以使用 esm.run：

<script src="https://esm.run/@material/web/all.js" type="module"></script>

例子：

<label>
  Material 3
  <md-checkbox checked></md-checkbox>
</label>

<md-outlined-button>Back</md-outlined-button>
<md-filled-button>Next</md-filled-button>
<script src="https://esm.run/@material/web/all.js" type="module"></script>

（来源：https://github.com/material-components/material-web/discussions/5239#discussioncomment-7721589）

相关内容