创建第一个Vue2项目-----HelloWorld

news/2024/12/22 1:18:44/

创建第一个Vue项目

  1. 第一步先去安装Vue,一共有两种安装方式,这里使用

点击这里下载:Vue.js
在这里插入图片描述
添加到自己的项目中
在这里插入图片描述
在使用的页面引入<script src="../js/vue.js"></script>
2. 准备好一个容器

<div id="root"><h1>hello{{name}}</h1>
</div>
  1. 创建一个Vue实例
<script>Vue.config.productionTip = false //阻止 vue 在启动时生成产生提示。// 创建Vue实例new Vue({el:'#root', //el用于指定当前Vue实例为那个容器服务,值通常为css选择器字符串。data:{//data用于存储数据,数据供el指定的容器使用,暂时写成一个对象name:'World'}})
</script>
  1. 运行时浏览器还需安装vue的开发者工具
    链接:https://pan.baidu.com/s/1JzHx27vZ5_c8F9gHA5gzgg?pwd=0622
    提取码:0622
  2. 打开浏览器的设置中的拓展程序,打开开发者模式直接将文件拖入浏览器中下载即可
    在这里插入图片描述

最后回到vscode中运行html页面,运行没问题且看到Vue后就代表安装成功了

在这里插入图片描述


http://www.ppmy.cn/news/1267787.html

相关文章

大数据湖体系规划与建设方案:PPT全文51页,附下载

关键词&#xff1a;大数据解决方案&#xff0c;数据湖解决方案&#xff0c;数据数仓建设方案&#xff0c;大数据湖建设规划&#xff0c;大数据湖发展趋势 一、大数据湖体系规划与建设背景 在传统的企业信息化建设中&#xff0c;各个业务系统通常是独立建设的&#xff0c;导致…

【算法题】智能成绩表(js)

总分相同按名字字典顺序。 解法&#xff1a; function solution(lines) {const [personNum, subjectNum] lines[0].split(" ").map((item) > parseInt(item));const subjects lines[1].split(" ");const classMates [];let results [];for (let i…

AI全栈大模型工程师(二十五)Transformer

文章目录 九、Transformer 江山一统9.1、**消除恐惧:**我们亲手写一个 Transformer9.1.1、Embeddings9.1.2、单头 Attention单个头的注意力计算9.1.3、多头 Attention9.1.4、全连接网络(Feed-Forward Network)9.1.5、拼成一层 Transformer9.1.6、多层 Transformer 构成 BERT…

redis-学习笔记(Jedis 前置知识)

自定义的 Redis 客户端 咱们可以实现编写出一个自定义的 Redis 客户端 因为 Redis 公开了自己使用的自定义协议 ---- RESP 协议清楚了, 那么通信数据格式就清除了, 就能完成各层次之间的数据传输, 就能开发服务器和客户端 RESP — Redis 的 序列化 协议 特点: 简单好实现快读进…

软件测试基础知识+面试总结(超详细整理)

一、什么是软件&#xff1f; 软件是计算机系统中的程序和相关文件或文档的总称。 二、什么是软件测试&#xff1f; 说法一&#xff1a;使用人工或自动的手段来运行或测量软件系统的过程&#xff0c;以检验软件系统是否满足规定的要求&#xff0c;并找出与预期结果之间的差异…

【计算机设计大赛】冬残奥会可视化系统_附源码—信息可视化赛道获奖项目深入剖析【可视化项目案例-19】

🎉🎊🎉 你的技术旅程将在这里启航! 记得看本专栏里顶置的可视化宝典导航贴哦! 🚀🚀 本专栏为可视化专栏,包含现有的所有可视化技术。订阅专栏用户在文章底部可下载对应案例完整源码以供大家深入的学习研究。 🎓 每一个案例都会提供完整代码和详细的讲解,不论你…

用modelbox server启动流程图,暴露Restful接口

背景 假设你已经搭建了modelbox开发容器&#xff0c;能够使用webUI构建流程图。如果没有请参考昇腾npu上构建modelbox webUI开发容器教程。 现在&#xff0c;本文会说明&#xff0c;如何在终端用命令的方式将流程图暴露为服务&#xff0c;并能够在本地用postman访问。 本文参…

SAP 标准GUI 中增加按钮时报错:EC181

今天在打一个note的时候&#xff0c;需要做一些手动的调整&#xff0c;其中的步骤就需要我去在标准的GUI STATUS 增加按钮 我在进入编辑模式的时候&#xff0c;直接去插入的时候&#xff0c;始终报错如下&#xff1a; Function code xxxx has not been assigned to a functio…