• 参考书籍《Vue.js快跑:构建触手可及的高性能Web应用》第1章 Vue.js基础-----1-2安装和设置


    安装Vue不需要任何特殊的工具,使用下面的代码就可以实现:

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Vue</title>
    </head>
    
    <body>
      <div id="app"></div>
    
      <script src="https://unpkg.com/vue"></script>
      <script>
        new Vue({
          el: "#app",
          created() {
            //这段代码启动时会运行
            alert("与vueJs的美好邂逅")
          }
        })
      </script>
    </body>
    </html>

    注意:

    1. 首先有一个ID为app的div元素用于初始化Vue——因为多种原因,不能在body元素上进行初始化。
    2. 在页面上引用CDN版本的Vue文件。当然也可以下载到本地并引用。
    3. 创建一个Vue的实例,并将该实例的el属性指向之前提到的div元素。

    上述方式适合用于单页面的引用,对于复杂项目希望使用类似webpack这样的打包工具。

    1. 安装nodeJs
    2. 安装webpack。
    3. 安装vue-cli
      1. npm install --global vue-cli
      2. vue init webpack

        

    npm run dev 启动

    访问:http://localhost:8080

    恭喜——你已经创建了你的第一个Vue工程!

  • 相关阅读:
    cocos2d 多点触摸
    mac 下安装node.js
    黑鹰破解笔记(2)
    OD使用心得笔记二
    淘宝店开始进行审核
    黑鹰破解笔记(1)
    Lisp笔记1
    OD使用心得笔记一
    怒马
    近段时间的web开发
  • 原文地址:https://www.cnblogs.com/cuilichao/p/14892296.html
Copyright © 2020-2023  润新知