vue的ui库使用Element UI,纯html页面,不使用webpack那玩意

使用手册访问:https://cloud.tencent.com/developer/doc/1270

第一步:在head添加样式

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

第二步:在html代码之后加
  <!-- import Vue before Element -->
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <!-- import JavaScript -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>

注意:使用element标签的div的id必须在new vue{}对象里:

例如:
<body>
  <div id="app">  --element标签的div的id为#app
<el-button @click="visible = true">Button</el-button> <el-dialog :visible.sync="visible" title="Hello world"> <p>Try Element</p> </el-dialog> </div> </body>


<script>
    new Vue({
      el: '#app',  ---那么#app就必须在new Vue的el里
      data: function() {
        return { visible: false }
      }
    })
  </script>

注:不用安装什么
npm i element-ui -S 之类的
 
原文地址:https://www.cnblogs.com/NJM-F/p/10122533.html