引入Vue的方式

news2025/2/5 9:11:45

1.cdn引入

<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
 
  <h2>哈哈哈</h2>
  <p>我是内容, 呵呵呵呵</p>
 
  <div id="app"></div>
   
  <!-- CDN地址 -->
  <script src="https://unpkg.com/vue@next"></script>
  <script>
    // 使用Vue
    const app = Vue.createApp({
      template: `<h2>Hello World</h2><span>呵呵呵</span>`
    })
    // 挂载
    app.mount("#app")
 
  </script>
</body>
</html>

 2.本地下载vue.js引入

<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
 
  <div id="app"></div>
   
  <script src="./lib/vue.js"></script>
  <script>
     
    // 1.创建app
    const app = Vue.createApp({
      template: `<h1>Hello Vue</h1>`
    })
 
    // 2.挂载app
    app.mount("#app")
 
  </script>
 
</body>
</html>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/761615.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

竞赛管理系统实现自动化测试

竞赛管理系统实现自动化测试

目录 一、为竞赛管理系统设计测试用例 二、根据测试用例进行测试 登录页面测试 功能测试 界面测试 用户注册页面 功能测试 界面测试 竞赛信息列表页面测试 界面测试 添加竞赛信息页面测试 功能测试 界面测试 修改竞赛信息页面测试 功能测试 一、为竞赛管理…
阅读更多...
Rollup 的作用、使用教程、支持 Vue、以及与 Webpack / Babel 的区别

Rollup 的作用、使用教程、支持 Vue、以及与 Webpack / Babel 的区别

一、前置知识 没接触过前端模块化概念的同学可先参考&#xff1a;JS & Node 模块化解释&#xff1a;AMD、UMD、CommonJS、 ESM 二、什么是 Rollup &#xff1f; Rollup 工具可以将代码转成不同模块&#xff0c;实现一套代码多端&#xff08;浏览器/Node&#xff09;引入…
阅读更多...
SpringBoot的静态资源文件访问问题

SpringBoot的静态资源文件访问问题

一、采用默认的文件存放位置&#xff1a; Spring Boot 对静态资源映射提供了默认配置&#xff0c; 默认将 /** 所有访问映射到以下目录&#xff1a; classpath:/static classpath:/public classpath:/resources classpath:/META-INF/resources在如上路径的文件可以被直接访问…
阅读更多...
Havoc！新的开源命令和控制C2框架

Havoc！新的开源命令和控制C2框架

工具介绍 Havoc是一款现代化可扩展的后渗透命令控制框架&#xff0c;可作为Cobalt Strike和Brute Ratel等付费选项的替代方案。 关注【Hack分享吧】公众号&#xff0c;回复关键字【230618】获取下载链接 Havoc包含各种各样的模块&#xff0c;允许渗透测试人员&#xff08;和黑…
阅读更多...
Rust 数据类型 之 结构体（Struct）

Rust 数据类型 之 结构体（Struct）

目录 结构体&#xff08;Struct&#xff09; 定义与声明 结构体定义 结构体实例 结构体分类 单元结构体&#xff08;Unit Struct&#xff09; 元组结构体&#xff08;Tuple Struct&#xff09; 具名结构体&#xff08;Named Struct&#xff09; 结构体嵌套 结构体方法…
阅读更多...
华为云ROMA Connect 的智能集成 – 现代企业数字化转型的新利器

华为云ROMA Connect 的智能集成 – 现代企业数字化转型的新利器

在当今数字信息智能化的时代&#xff0c;人工智能技术逐渐深入企业的生产流程和实践中。人工智能的应用成为现代企业数字化转型的新利器。华为云的ROMA Connect作为企业级的融合集成服务 EiPaaS平台&#xff0c;从今年开始也进入了人工智能技术&#xff0c;针对几个主要的企业集…
阅读更多...
新一代iPaaS全域融合集成平台ROMA Connect HDC.Cloud 2023内容值得再读！

新一代iPaaS全域融合集成平台ROMA Connect HDC.Cloud 2023内容值得再读！

华为云下一代ROMA Connect HDC.Cloud 2023 精彩内容摘要&#xff1a; 7月9号 分论坛上嘉宾分享一站式融合集成平台解决的用户痛点、应用场景、新一代全域升级的新特性、以及伙伴分享案例干活 ROMA Connect 展台提供开发者体验全新升级版ROMA Connect的 AI智能集成 HDC.Cloud…
阅读更多...
华为OD机试真题 Java 实现【战场索敌】【2023 B卷 100分】，深度优先搜索dfs算法，这眼花缭乱的，你这是“战场索鬼”吧？

华为OD机试真题 Java 实现【战场索敌】【2023 B卷 100分】，深度优先搜索dfs算法，这眼花缭乱的，你这是“战场索鬼”吧？

目录 专栏导读一、题目描述二、输入描述三、输出描述四、深度优先搜索dfs五、解题思路六、Java算法源码七、效果展示1、输入2、输出3、说明4、如果增加目标敌人数量K为55、来&#xff0c;上强度 华为OD机试 2023B卷题库疯狂收录中&#xff0c;刷题点这里 专栏导读 本专栏收录于…
阅读更多...
从零开始 Spring Cloud 4：Nacos

从零开始 Spring Cloud 4：Nacos

从零开始 Spring Cloud 4&#xff1a;Nacos 图源&#xff1a;laiketui.com Nacos 是 Alibaba 研发的用于 Spring Cloud Alibaba 的服务注册中心组件&#xff0c;符合 Spring Cloud 官方标准&#xff0c;同样被 Spring Cloud 官方接纳&#xff0c;所以我们可以在 Spring Cloud …
阅读更多...
FPGA XDMA 中断模式实现 PCIE3.0 测速试验 提供工程源码和QT上位机源码

FPGA XDMA 中断模式实现 PCIE3.0 测速试验 提供工程源码和QT上位机源码

目录 1、前言2、我已有的PCIE方案3、PCIE理论4、总体设计思路和方案XDMA简介XDMA中断模式QT上位机及其源码 5、vivado工程详解6、上板调试验证7、福利&#xff1a;工程代码的获取 1、前言 PCIE&#xff08;PCI Express&#xff09;采用了目前业内流行的点对点串行连接&#xf…
阅读更多...
同步和异步的区别

同步和异步的区别

同步&#xff0c;可以理解为在执行完一个函数或方法之后&#xff0c;一直等待系统返回值或消息&#xff0c;这时程序是处于阻塞的&#xff0c;只有接收到返回的值或消息后才往下执行其他的命令&#xff1b; 异步&#xff0c;执行完函数或方法后&#xff0c;不必阻塞性地等待返回…
阅读更多...
缓存服务使用总结

缓存服务使用总结

1、介绍 分布式缓存方案缓存服务搭建 2、分布式缓存方案&#xff08;重点掌握&#xff09; 2.1、什么是缓存 通常将数据从数据库中同步一份到内存中&#xff0c;客户端直接从内存中查询数据&#xff0c;减少了和数据库的交互次数&#xff0c;提高查询性能&#xff08;因为内…
阅读更多...
什么是 WebSocket？Java 中如何实现 WebSocket？

什么是 WebSocket？Java 中如何实现 WebSocket？

什么是 WebSocket&#xff1f;Java 中如何实现 WebSocket&#xff1f; WebSocket 简介 WebSocket 是一种新型的网络协议&#xff0c;它允许客户端和服务器之间进行双向通信&#xff0c;可以实现实时数据交互。WebSocket 协议是基于 HTTP 协议的&#xff0c;使用标准的 TCP 连…
阅读更多...
java项目之（超市管理系统ssm+mysql+jsp）

java项目之（超市管理系统ssm+mysql+jsp）

风定落花生&#xff0c;歌声逐流水&#xff0c;大家好我是风歌&#xff0c;混迹在java圈的辛苦码农。今天要和大家聊的是一款基于ssm的超市管理系统。技术交流和部署相关看文章末尾&#xff01; 目录 开发环境&#xff1a; 后端&#xff1a; 前端&#xff1a; 数据库&…
阅读更多...
【MySQL系列】深入学习数据类型

【MySQL系列】深入学习数据类型

「前言」文章内容大致是数据库的数据类型。 「归属专栏」MySQL 「主页链接」个人主页 「笔者」枫叶先生(fy) 目录 一、数据类型分类二、数值类型2.1 tinyint类型2.2 bit类型2.3 小数类型2.3.1 float类型2.3.2 decimal类型 2.4 字符串类型2.4.1 char类型2.4.2 varchar类型2.4.3 …
阅读更多...
高时空分辨率、高精度一体化预测技术之风、光、水能源自动化预测技术应用

高时空分辨率、高精度一体化预测技术之风、光、水能源自动化预测技术应用

能源是国民经济发展和人民生活必须的重要物质基础。在过去的200多年里&#xff0c;建立在煤炭、石油、天然气等化石燃料基础上的能源体系极大的推动了人类社会的发展。但是人类在使用化石燃料的同时&#xff0c;也带来了严重的环境污染和生态系统破坏。近年来&#xff0c;世界各…
阅读更多...
如何快速又高质量的输出PDF实验报告？

如何快速又高质量的输出PDF实验报告？

摘要&#xff1a;本文由葡萄城技术团队于CSDN原创并首发。转载请注明出处&#xff1a;葡萄城官网&#xff0c;葡萄城为开发者提供专业的开发工具、解决方案和服务&#xff0c;赋能开发者。 PDF文档的打印在很多应用场景中都会被使用到&#xff0c;最为常见的就是实验室信息管理…
阅读更多...
rockchip linux Vendor storage 及SN添加

rockchip linux Vendor storage 及SN添加

前言 在产品开发过程中，最后都会为产品编辑一个产品编号方便于管理和维护，而SN（Series Number）就是用于产品的生产编号。但是在linux中，并没有专门管理串码的驱动。 Vendor storage 是rockchip 被设计用来存储 SN，MAC，LAN，BT 等 vendor data。特征如下： 唯一的访问…
阅读更多...
一些有意思的SCI

一些有意思的SCI

Gardner J K, Knopoff L. Is the sequence of earthquakes in Southern California, with aftershocks removed, Poissonian?[J]. Bulletin of the seismological society of America, 1974, 64(5): 1363-1367. [原文] 该论文的abstract只有一个单词&#xff1a;Yes。 目前该论…
阅读更多...
MySQL索引使用原则，什么是覆盖索引、索引下堆、离散度……这些概念你弄明白了吗

MySQL索引使用原则，什么是覆盖索引、索引下堆、离散度……这些概念你弄明白了吗

文章目录 一、索引失效的场景二、列的离散度三、联合索引最左匹配1、什么时候用联合索引2、什么是覆盖索引 四、索引条件下推&#xff08;ICP&#xff09; 一、索引失效的场景 MySQL索引失效的场景&#xff0c;什么情况下会造成MySQL索引失效 二、列的离散度 什么是列的离散…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023