如何直接在html中使用vue,就是说不做工程化

如何直接在html中使用vue,就是说不做工程化
以下再一个html

<div id="app">
    <el-input v-model="inputValue" placeholder="请输入内容"></el-input>
    <el-button type="primary" @click="handleClick">点击</el-button>
    <p>{{message}}</p>
  </div>

以下代码保存到html文件中,直接执行应该就是你要的了

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Vue2+ElementUI Demo</title>
  <link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.13/lib/theme-chalk/index.css">
</head>
<body>
  <div id="app">
    <el-input v-model="inputValue" placeholder="请输入内容"></el-input>
    <el-button type="primary" @click="handleClick">点击</el-button>
    <p>{{message}}</p>
  </div>
  <script src="https://unpkg.com/vue@2.7.14/dist/vue.js"></script>
  <script src="https://unpkg.com/element-ui@2.15.13/lib/index.js"></script>
  <script>
    new Vue({
      el: '#app',
      data: {
        inputValue: '',
        message: ''
      },
      methods: {
        handleClick() {
          this.message = '你输入的内容是:' + this.inputValue
        }
      }
    })
  </script>
</body>
</html>