elementui 如何在一个html文件中直接使用？

要在一个HTML文件中直接使用ElementUI，你需要遵循以下步骤：

引入Vue.js: 因为ElementUI是基于Vue.js构建的，所以首先需要引入Vue.js库。你可以通过CDN链接来引入Vue.js的最新版本或指定版本：

<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>

引入ElementUI: 接着，同样通过CDN引入ElementUI的CSS和JavaScript文件。这里也是使用CDN链接：

<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

创建Vue实例并使用ElementUI组件: 在你的HTML中，创建一个Vue实例，并挂载到页面上。在Vue实例中，你可以开始使用ElementUI的组件。

<div id="app">
  <el-button type="primary">点击我</el-button>
</div>

<script>
  new Vue({
    el: '#app'
  });
</script>

以上代码示例展示了如何在HTML文件中引入Vue.js和ElementUI，并使用了一个简单的ElementUI按钮组件(<el-button>)。

请注意，由于ElementUI主要设计用于Vue.js 2.x，如果你正在使用Vue 3，可能需要使用Element Plus，它是ElementUI的Vue 3兼容版本。引入Element Plus的方式类似，但你需要替换CDN链接为Element Plus的相应资源。

Was this helpful?

0 / 0

#ElementUI