03-Vue安装

已于 2022-02-18 09:35:34 修改
阅读量3.6k 收藏
点赞数
分类专栏： Vue 文章标签： vue.js html html5
于 2021-09-15 14:34:59 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/MOOG007/article/details/120304551
版权

一、安装Vue

  • 在开始学习Vue的时候，是直接在HTML代码中通过script标签引入vue.js文件
  • 打开Vue官网，进去主页面，默认是英文，改成中文页面
    在这里插入图片描述
  • 官网里面两个重要的版块：
    在这里插入图片描述
  • 安装方式
    在这里插入图片描述
  • 在开始学习的时候，我们使用第一种方式引入：即直接用<script>引入
  • 下载vue.js到本地
    在这里插入图片描述
  • 在项目中引入
    在这里插入图片描述
  • 打开浏览器的控制台
    在这里插入图片描述
  • 看看我们在代码中编写的new Vue({...})中的Vue是个什么东西：Vue就是一个函数
    在这里插入图片描述

二、Chrome浏览器安装Vue开发工具

三、Vue API：全局配置

  • 【学习】→ 【API】
    在这里插入图片描述

  • Vue的全局配置 Vue.config: 一处修改，到处生效
    在这里插入图片描述
    在这里插入图片描述

点康慕
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
2021-03-27 Vue上
qq_43218276的博客
03-29 845
Vue学习留存VueVue基础简介第一个Vue程序el挂载点Vue实例的作用范围是否可用其他的选择器是否可以设置el挂载其他的dom元素data数据对象本地应用介绍v-text指令v-htmlv-on指令基础计数器v-show指令v-if指令v-bind指令图片切换v-for指令v-on补充v-model指令小黑记事本-介绍小黑记事本-新增小黑记事本-删除小黑记事本-统计小黑记事本-清空小黑记事本-隐藏网络应用介绍axios基本使用axios加vue天知道-介绍天知道-回车查询天知道-点击查询综合应用介绍音
vue框架-vue-cli
qq_44715376的博客
02-18 1639
VUE-cli
vue.js 三种方式安装(vue-cli)
热门推荐
muzidigbig的博客
05-29 33万+
Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手，还便于与第三方库或既有项目整合。 下面介绍三种 Vue.js 的安装方法： 1.独立版本 我们可以在Vue.js的官网上直接下载vue assets和static的区别 pnpm nvm(管理Node版本)、nrm(管理镜像源) 详解 Vue生命周期 父子组件的执行顺序
day03-Vue-Element
yirenyuan的博客
03-01 945
一、Ajax | 二、前后台分离开发 | 三、前端工程化 | 四、Vue组件库Element | 五、Vue路由 | 六、打包部署 |
liunx 安装/使用 Minio （RuoYi-Vue-Plus）
weixin_45857153的博客
05-06 629
liunx 安装 minio （完整流程）
day03-vue
weixin_53060535的博客
09-06 210
vue入门学习，吐槽：前端太折磨人了
nodejs服务器及安装vue脚手架--vue-cli
weixin_52725665的博客
04-17 433
写好的vue工程—把我们的工程部署到该服务器上。注意:不要安装到中文目录下或者空格的目录下。创建标准的 vue 工程。
VUE 安装node-sass 报错
weixin_50567696的博客
06-03 1044
npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!npm ERR!
03-vue基础-插值表达式
hucongcong2015的专栏
05-22 1570
文章目录vue插值表达式vue通过data提供数据通过插值表达式显示数据安装vue开发者工具总结 vue插值表达式 本文要讲解的内容如下： 通过data提供数据 通过插值表达式显示数据 vue开发者工具的安装与使用 vue通过data提供数据 vue中通过template可以提供模板，但是这样的数据是写死的。 vue是数据驱动的，应该如何提供数据，将来控制视图呢？ vue可以通过data提供数据 data必须是一个函数，并且返回一个对象，这个对象就代表vue提供的数据 <script>
03-vuecli3.rar
11-06
首先，你需要在全局安装 Vue CLI 3，这通常通过 Node.js 的包管理器 npm (Node Package Manager) 来完成： ```bash npm install -g @vue/cli ``` 或使用 yarn（如果已安装）： ```bash yarn global add @vue/cli ```...
vue-okr-tree:http
03-19
更新时间2021/02/03增加node-btn-content属性，对展开圆圈内容自定义处理vue-okr-tree@1.0.8 更新时间2021/02/04增加showNodeNum属性显示子节点数vue-okr-tree@1.0.9 文档和事例 地址： : Vue-Okr-树 基于Vue 2的...
Vue全家桶（三）：Vue前端交互（视频课程）.zip
08-21
在本课程“Vue全家桶（三）：Vue前端交互”中，我们将深入探讨Vue.js框架在实际项目中与后端进行数据交互的各种方法和技术。这个系列涵盖了从基础的交互模式到高级的异步处理策略，旨在提升开发者在构建前端应用程序...
Vue前端路由详解——以Ruoyi框架为案例学习
警警的博客
09-03 1076
Ruoyi框架前端路由通过Vue Router实现，支持静态路由和动态路由的配置，通过路由守卫实现权限控制等需求，采用路由懒加载提高应用性能，并通过路由元信息存储自定义信息。这些特性共同构成了Ruoyi框架前端路由的完整体系，为开发者提供了灵活、强大的路由管理能力。
Vue2 中对数组进行操作时需要注意什么
最新发布
m0_73882020的博客
09-06 517
在 Vue 2 中，对数组进行操作时，关键是确保操作能够被 Vue 的响应式系统检测到。使用 Vue 的响应式 API，如Vue.set或this.$set，可以确保数组的变化会被正确地反映到视图中。此外，避免直接修改数组的length属性或使用数组索引直接赋值，以确保视图的响应性。
在 Vue 中实现跨项目数据传递
世轩的博客
09-03 1495
需要注意的是，跨项目数据传递可能会带来一些安全和数据一致性的问题。在实际应用中，要根据具体情况选择合适的方法，并确保数据的安全性和可靠性。同时，对于敏感数据，应该采取加密等安全措施。
GoFly企业版里的阿里图标如何增加自定义图标到后台
GoFLy开发者的博客
09-04 543
（3）将生成好的图标复制.js文件放到项目index.html文件中。（1）配置 FontClass/Symbol 前缀为：svgfont-（2）配置 Font Family 为 iconfont。在使用位置的组件，返回图标名称。
开发适合el-dialog的拉伸拖拽自定义指令和适配自定义的图片查看组件
鹤渺的星球
09-05 1400
我之前有开发过一个图片查看的组件，这个组件可在单页面打开，也可以在弹窗里打开，但是弹窗因为是比较固定，所以有一些局限性，只能拖拽，不能改变弹窗大小，于是有了开发【可以拖拽改变大小的弹窗】组件。通过自定义指令，实现弹窗的移动拖拽拉伸等功能动态计算弹窗的位置与尺寸，因为弹窗的位置和尺寸是动态计算的，涉及到鼠标的实时位置和弹窗初始位置之间的关系。代码也贴上去了，仅供参考。
标签中的ref属性
qq_40792800的博客
09-04 767
可能存在的情况是，在挂载之前，ref() 函数已经执行，此时获取的引用则是undefined，在挂载之后，Vue 底层会自动找到对应的 ref() 与 经过ref 标记的DOM或组件，并赋值给 Value属性。1、在标签中添加 ref 属性的同时，需要在 脚本中 通过 ref() 函数定义一个容器来放置 给ref属性打上标签的DOM或组件实例，且接收的变量需要 与 标签中的ref 属性值相同。按照Vue2 的情况，此时在父组件中是可以访问到子组件中的数据的，但是通过打印，我们发现什么都没拿到。
G:\demo\ruisi_portal_web>npm install @element-plus/icons-vue npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @vitejs/plugin-vue@1.10.2 npm ERR! Found: vite@2.3.7 npm ERR! node_modules/vite npm ERR! dev vite@"2.3.7" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer vite@"^2.5.10" from @vitejs/plugin-vue@1.10.2 npm ERR! node_modules/@vitejs/plugin-vue npm ERR! dev @vitejs/plugin-vue@"^1.2.3" from the root project npm ERR! npm ERR! Conflicting peer dependency: vite@2.9.16 npm ERR! node_modules/vite npm ERR! peer vite@"^2.5.10" from @vitejs/plugin-vue@1.10.2npm ERR! node_modules/@vitejs/plugin-vue npm ERR! dev @vitejs/plugin-vue@"^1.2.3" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! npm ERR! For a full report see: npm ERR! C:\Users\Administrator\AppData\Local\npm-cache\_logs\2023-07-12T03_31_05_406Z-eresolve-report.txt npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Administrator\AppData\Local\npm-cache\_logs\2023-07-12T03_31_05_406Z-debug-0.log
07-13
这个错误提示是由于在安装`@element-plus/icons-vue`时出现了依赖解析的问题。根据错误信息，你的项目中存在冲突的依赖版本。 为了解决这个问题，你可以尝试以下几个步骤： 1. 清除你的npm缓存： ``` npm cache ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值