vue3学习笔记-快速上手

创建第一个vue3的应用

之前看书学习vue,书籍对应的版本是vue2,今天群里看小伙伴聊天,觉得他们说得对 ,反正是从零开始学,而且vue2都不维护了,那为什么不直接学习vue3呢,于是乎,又开启了从0学vue3之路。

参考教程:https://cn.vuejs.org/guide/quick-start.html

安装nodejs环境之后,执行 npm create vue@latest 命令就可以初始化一个vue3的项目:

600442a7575f1057ff16d8faefbb78e8.jpeg

因为很多功能后面都需要学,所以一开始初始化项目的时候,可以选择否。

了解组合式API和选项式API的区别

4c21405df28f4739d889e97eb4af06f2.jpeg

通过 CDN 使用 Vue 时,无法使用单文件组件 (SFC) 语法,这句话怎么理解?

09cd2f4f282013a18ad2ae83d49b0b21.jpeg

通过 CDN 使用 Vue:这意味着你可以直接在 HTML 页面中通过 <script> 标签引入 Vue.js 的 CDN 链接,而不需要通过 npm 或 yarn 等包管理工具安装 Vue.js。这种方式简单快捷,适合于快速原型开发或小型项目。

Vue.js 的单文件组件是一种特殊的文件格式,它允许你将模板、JavaScript 逻辑和样式都写在一个 .vue 文件中。这种格式需要构建工具来处理,因为它们需要被编译成浏览器可以理解的格式。由于通过 CDN 使用 Vue.js 不涉及构建步骤,因此你不能直接使用 .vue 文件。相反,你需要将 Vue 组件的逻辑、模板和样式分开编写,并直接在浏览器中通过 <script>、<style> 和 HTML 直接编写模板

使用 ES 模块构建版本

<script type="module">的含义

4862ecf943fcedfd6571aadcf5c91d88.jpeg

发现将圈中的位置改成其他命名,页面也可以正常访问:

661ff0730d32eab257b5696e22200e68.jpeg

如果你也对vue的学习感兴趣,那就快来加入一起学习交流吧

e954fed0aa727e522b987d6c392c9c20.png

相关推荐

  1. vue3快速

    2024-04-29 04:32:02       37 阅读
  2. Vue3快速

    2024-04-29 04:32:02       27 阅读
  3. vue3中路由守卫的快速

    2024-04-29 04:32:02       38 阅读
  4. Vue2快速

    2024-04-29 04:32:02       8 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-04-29 04:32:02       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-04-29 04:32:02       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-04-29 04:32:02       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-04-29 04:32:02       18 阅读

热门阅读

  1. Springboot 使用hutool国密算法

    2024-04-29 04:32:02       19 阅读
  2. 联合国官方统计的十大基本原则是什么

    2024-04-29 04:32:02       15 阅读
  3. PCIE与上位机调试流程

    2024-04-29 04:32:02       37 阅读
  4. 杆塔倾斜测量原理

    2024-04-29 04:32:02       26 阅读
  5. TypeScript 学习笔记

    2024-04-29 04:32:02       40 阅读
  6. 线程池问题

    2024-04-29 04:32:02       11 阅读
  7. 事务与锁机制

    2024-04-29 04:32:02       12 阅读