-
Vue的基本拓展插件有哪些?
2020-03-05 15:39:00vue-cli: vue 脚手架 vue-resource(axios): ajax 请求 vue-router: 路由 vuex: 状态管理 vue-lazyload: 图片懒加载 ...mint-ui: 基于 vue 的 UI 组件库(移动端) element-ui: 基于 vue 的 UI 组件库(PC 端) ...- vue-cli: vue 脚手架
- vue-resource(axios): ajax 请求
- vue-router: 路由
- vuex: 状态管理
- vue-lazyload: 图片懒加载
- vue-scroller: 页面滑动相关
- mint-ui: 基于 vue 的 UI 组件库(移动端)
- element-ui: 基于 vue 的 UI 组件库(PC 端)
-
vscode 开发vue必备插件_VSCode中Vue开发推荐插件和VSCode快捷键都有哪些
2021-02-04 23:50:55VSCode中Vue开发推荐插件和VSCode快捷键都有哪些发布时间:2020-08-10 16:02:52来源:亿速云阅读:108作者:小新这篇文章主要介绍VSCode中Vue开发推荐插件和VSCode快捷键都有哪些,文中介绍的非常详细,具有一定的...VSCode中Vue开发推荐插件和VSCode快捷键都有哪些
发布时间:2020-08-10 16:02:52
来源:亿速云
阅读:108
作者:小新
这篇文章主要介绍VSCode中Vue开发推荐插件和VSCode快捷键都有哪些,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
首先这几个是VSCode推荐Vue开发必备的插件
Vetur —— 语法高亮、智能感知、Emmet等
包含格式化功能, Alt+Shift+F (格式化全文),Ctrl+K Ctrl+F(格式化选中代码,两个Ctrl需要同时按着)
EsLint —— 语法纠错
Debugger for Chrome —— 映射vscode上的断点到chrome上,方便调试(配置有点麻烦,其实我没用这个)
Auto Close Tag —— 自动闭合HTML/XML标签
Auto Rename Tag —— 自动完成另一侧标签的同步修改
JavaScript(ES6) code snippets —— ES6语法智能提示以及快速输入,除js外还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间
Path Intellisense —— 自动路劲补全
HTML CSS Support —— 让 html 标签上写class 智能提示当前项目所支持的样式
VSCode快捷键
常用 General按 Press功能 FunctionCtrl + Shift + P,F1显示命令面板 Show Command Palette
Ctrl + P快速打开 Quick Open
Ctrl + Shift + N新窗口/实例 New window/instance
Ctrl + Shift + W关闭窗口/实例 Close window/instance
基础编辑 Basic editing按 Press功能 FunctionCtrl+X剪切行(空选定) Cut line (empty selection)
Ctrl+C复制行(空选定)Copy line (empty selection)
Alt+ ↑ / ↓向上/向下移动行 Move line up/down
Shift+Alt + ↓ / ↑向上/向下复制行 Copy line up/down
Ctrl+Shift+K删除行 Delete line
Ctrl+Enter在下面插入行 Insert line below
Ctrl+Shift+Enter在上面插入行 Insert line above
Ctrl+Shift+\跳到匹配的括号 Jump to matching bracket
Ctrl+] / [缩进/缩进行 Indent/outdent line
Home转到行首 Go to beginning of line
End转到行尾 Go to end of line
Ctrl+Home转到文件开头 Go to beginning of file
Ctrl+End转到文件末尾 Go to end of file
Ctrl+↑ / ↓向上/向下滚动行 Scroll line up/down
Alt+PgUp / PgDown向上/向下滚动页面 Scroll page up/down
Ctrl+Shift+[折叠(折叠)区域 Fold (collapse) region
Ctrl+Shift+]展开(未折叠)区域 Unfold (uncollapse) region
Ctrl+K Ctrl+[折叠(未折叠)所有子区域 Fold (collapse) all subregions
Ctrl+K Ctrl+]展开(未折叠)所有子区域 Unfold (uncollapse) all subregions
Ctrl+K Ctrl+0折叠(折叠)所有区域 Fold (collapse) all regions
Ctrl+K Ctrl+J展开(未折叠)所有区域 Unfold (uncollapse) all regions
Ctrl+K Ctrl+C添加行注释 Add line comment
Ctrl+K Ctrl+U删除行注释 Remove line comment
Ctrl+/切换行注释 Toggle line comment
Shift+Alt+A切换块注释 Toggle block comment
Alt+Z切换换行 Toggle word wrap
导航 Navigation按 Press功能 FunctionCtrl + T显示所有符号 Show all Symbols
Ctrl + G转到行... Go to Line...
Ctrl + P转到文件... Go to File...
Ctrl + Shift + O转到符号... Go to Symbol...
Ctrl + Shift + M显示问题面板 Show Problems panel
F8转到下一个错误或警告 Go to next error or warning
Shift + F8转到上一个错误或警告 Go to previous error or warning
Ctrl + Shift + Tab导航编辑器组历史记录 Navigate editor group history
Alt + ←/→返回/前进 Go back / forward
Ctrl + M切换选项卡移动焦点 Toggle Tab moves focus
搜索和替换 Search and replace按 Press功能 FunctionCtrl + F查找 Find
Ctrl + H替换 Replace
F3 / Shift + F3查找下一个/上一个 Find next/previous
Alt + Enter选择查找匹配的所有出现 Select all occurences of Find match
Ctrl + D将选择添加到下一个查找匹配 Add selection to next Find match
Ctrl + K Ctrl + D将最后一个选择移至下一个查找匹配项 Move last selection to next Find match
Alt + C / R / W切换区分大小写/正则表达式/整个词 Toggle case-sensitive / regex / whole word
多光标和选择 Multi-cursor and selection按 Press功能 FunctionAlt +单击插入光标 Insert cursor
Ctrl + Alt +↑/↓在上/下插入光标 Insert cursor above / below
Ctrl + U撤消上一个光标操作 Undo last cursor operation
Shift + Alt + I在选定的每一行的末尾插入光标 Insert cursor at end of each line selected
Ctrl + I选择当前行 Select current line
Ctrl + Shift + L选择当前选择的所有出现 Select all occurrences of current selection
Ctrl + F2选择当前字的所有出现 Select all occurrences of current word
Shift + Alt + →展开选择 Expand selection
Shift + Alt + ←缩小选择 Shrink selection
Shift + Alt + (拖动鼠标)列(框)选择 Column (box) selection
Ctrl + Shift + Alt +(箭头键)列(框)选择 Column (box) selection
Ctrl + Shift + Alt + PgUp / PgDown列(框)选择页上/下 Column (box) selection page up/down
丰富的语言编辑 Rich languages editing按 Press功能 FunctionCtrl + 空格触发建议 Trigger suggestion
Ctrl + Shift + Space触发器参数提示 Trigger parameter hints
TabEmmet 展开缩写 Emmet expand abbreviation
Shift + Alt + F格式化文档 Format document
Ctrl + K Ctrl + F格式选定区域 Format selection
F12转到定义 Go to Definition
Alt + F12Peek定义 Peek Definition
Ctrl + K F12打开定义到边 Open Definition to the side
Ctrl + .快速解决 Quick Fix
Shift + F12显示引用 Show References
F2重命名符号 Rename Symbol
Ctrl + K Ctrl + X修剪尾随空格 Trim trailing whitespace
Ctrl + K M更改文件语言 Change file language
编辑器管理 Editor management按 Press功能 FunctionCtrl+F4, Ctrl+W关闭编辑器 Close editor
Ctrl+K F关闭文件夹 Close folder
Ctrl+\拆分编辑器 Split editor
Ctrl+ 1 / 2 / 3聚焦到第1,第2或第3编辑器组 Focus into 1st, 2nd or 3rd editor group
Ctrl+K Ctrl+ ←/→聚焦到上一个/下一个编辑器组 Focus into previous/next editor group
Ctrl+Shift+PgUp / PgDown向左/向右移动编辑器 Move editor left/right
Ctrl+K ← / →移动活动编辑器组 Move active editor group
文件管理 File management按 Press功能 FunctionCtrl+N新文件 New File
Ctrl+O打开文件... Open File...
Ctrl+S保存 Save
Ctrl+Shift+S另存为... Save As...
Ctrl+K S全部保存 Save All
Ctrl+F4关闭 Close
Ctrl+K Ctrl+W关闭所有 Close All
Ctrl+Shift+T重新打开关闭的编辑器 Reopen closed editor
Ctrl+K输入保持打开 Enter Keep Open
Ctrl+Tab打开下一个 Open next
Ctrl+Shift+Tab打开上一个 Open previous
Ctrl+K P复制活动文件的路径 Copy path of active file
Ctrl+K R显示资源管理器中的活动文件 Reveal active file in Explorer
Ctrl+K O显示新窗口/实例中的活动文件 Show active file in new window/instance
显示 Display按 Press功能 FunctionF11切换全屏 Toggle full screen
Shift+Alt+1切换编辑器布局 Toggle editor layout
Ctrl+ = / -放大/缩小 Zoom in/out
Ctrl+B切换侧栏可见性 Toggle Sidebar visibility
Ctrl+Shift+E显示浏览器/切换焦点 Show Explorer / Toggle focus
Ctrl+Shift+F显示搜索 Show Search
Ctrl+Shift+G显示Git Show Git
Ctrl+Shift+D显示调试 Show Debug
Ctrl+Shift+X显示扩展 Show Extensions
Ctrl+Shift+H替换文件 Replace in files
Ctrl+Shift+J切换搜索详细信息 Toggle Search details
Ctrl+Shift+C打开新命令提示符/终端 Open new command prompt/terminal
Ctrl+Shift+U显示输出面板 Show Output panel
Ctrl+Shift+V切换Markdown预览 Toggle Markdown preview
Ctrl+K V从旁边打开Markdown预览 Open Markdown preview to the side
调试 Debug按 Press功能 FunctionF9切换断点 Toggle breakpoint
F5开始/继续 Start/Continue
Shift+F5停止 Stop
F11 / Shift+F11下一步/上一步 Step into/out
F10跳过 Step over
Ctrl+K Ctrl+I显示悬停 Show hover
集成终端 Integrated terminal按 Press功能 FunctionCtrl+`显示集成终端 Show integrated terminal
Ctrl+Shift+`创建新终端 Create new terminal
Ctrl+Shift+C复制选定 Copy selection
Ctrl+Shift+V粘贴到活动端子 Paste into active terminal
Ctrl+↑ / ↓向上/向下滚动 Scroll up/down
Shift+PgUp / PgDown向上/向下滚动页面 Scroll page up/down
Ctrl+Home / End滚动到顶部/底部 Scroll to top/bottom
以上是VSCode中Vue开发推荐插件和VSCode快捷键都有哪些的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!
-
[vue] vue在组件中引入插件的方法有哪些?
2021-02-28 16:14:35[vue] vue在组件中引入插件的方法有哪些? 插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种: 添加全局方法或者属性。如: vue-custom-element 添加全局资源:指令/过滤器/过渡...[vue] vue在组件中引入插件的方法有哪些?
插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种: 添加全局方法或者属性。如: vue-custom-element 添加全局资源:指令/过滤器/过渡等。如 vue-touch 通过全局混入来添加一些组件选项。如 vue-router 添加 Vue 实例方法,通过把它们添加到 Vue.prototype 上实现。 一个库,提供自己的 API,同时提供上面提到的一个或多个功能。如 vue-router 示例:安装 ElementUI 安装:yarn add element-ui 引入,在 main.js 中写入以下内容: import Vue from 'vue' import App from './App.vue' import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; Vue.config.productionTip = false Vue.use(ElementUI); new Vue({ render: h => h(App), }).$mount('#app') 在组件中使用: <template> <div> <Button>Button</Button> </div> </template> <script> import { Button } from 'element-ui'; export default { components: { Button } }; </script>
个人简介
我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易,
但坚持一定很酷。欢迎大家一起讨论主目录
-
vue面试有哪些插件_vue 面试时需要准备的知识点
2020-12-30 21:36:00前端火热的框架层出不穷,作为码农的我们,依旧需要去学习,去探索新的问题,学习新技术,其实就是...vue的核心思想依旧是:构建用户界面的渐进式框架,关注视图的变化。这也是为什么新建的文件是结构是template s...前端火热的框架层出不穷,作为码农的我们,依旧需要去学习,去探索新的问题,学习新技术,其实就是为了写一手好的,自认为是高质量的代码。今天主要分享一下前端最火的框架vue,也是我比较喜欢的框架。
vue上手可以说是比较轻松而且简单,如果你用过angular,react,你也会很喜欢vue。vue的核心思想依旧是:构建用户界面的渐进式框架,关注视图的变化。这也是为什么新建的文件是结构是template script style
vue的使用由很多种,可以直接引入vue.js就可以开启vue的开发。但是这是初级的使用。在vue官网中推荐vue-cli,这个会帮我们自动引入全家桶开发环境。这里不做过多的解释,下面主要分向vue使用的一些经验,如果有不对的地方,请大神指正。
在任何系统总我们都会涉及到用户需要登录的验证才可以去访问某个页面,这里我的做法是借助vue的router组件,实现我的页面验证功能。在面试中,有可能面试官会问到我们有关于用户的权限设置。用户权限是基于角色的设计的,对于我们而言,就是在不同的用户访问我们的系统的时候,你需要根据用户的不同显示不同的组件状态(个人习惯把整个页面作为模块化,组件化区分);这里我们将进一步讨论组件的使用
在vue中我们常用的组件是父子组件,父子组件可以通过prop,而自组件是用自定义事件,$on(eventName) 监听事件 ,使用 $emit(eventName)触发事件 详细见教程 面试的时候提到这个一定要说到组件的通信,非组件通信手段状态管理。
vue的生命周期有哪些 beforeCreate(创建前),created(创建后),beforeMount(载入前),mounted(载入后),beforeUpdate(更新前),updated(更新后),beforeDestroy(销毁前),destroyed(销毁后)。
vue中es6的使用,这里需要注意下es6语法的一些新特性:比如箭头函数,变量命名,如果你的简历中涉及到es6那么推荐去看看这个es6特性。这个对于自己的提升可以说是相当大的。对于日后的快速开发,优雅代码会比较好。
vuex的掌握需要注意以下几点:
1.为什么用vuex?
2.vuex怎么用
3.vuex的插件的用法
针对上面这几点:很多前端入门者,很迷茫,做几点解释
1.vue什么时候用vuex,首先推荐不知道vuex的同学去看看vuex; 1)简单的单页面应用不用它2)能用store解决就不用它vuex
2.vuex的使用需要掌握state,getter(接收state),mutations(同步操作,组件中提交this.$store.commit('xxx')),action(Action 提交的是 mutation,而不是直接变更状态。Action 可以包含任意异步操作。),module(模块化state),其中state是基础,module是对于state过大时的划分模块,需要之一命名空间
3.vuex插件在插件中不允许直接修改状态——类似于组件,只能通过提交 mutation 来触发变化
最后,vue的学习是要不断去实践的,尝试的,包括脚手架的使用需要自己去掌握,开发环境的可配置化,多个不同环境对应api的修改。
原文出处:https://www.cnblogs.com/starryqian/p/8417304.html
-
vue面试有哪些插件_vue面试题整理
2021-01-16 02:23:33什么是SPA应用,SPA页面和传统页面有什么...什么是vuex,vuerouter,如何避免vuex中的函数造成全局污染vuex 为状态管理,它集中存储管理应用的所有组件的状态,可以理解成一个全局仓库。VueRouter是路由(spa)单页面... -
vue面试有哪些插件_你要的Vue面试题都在这里。
2020-12-21 21:22:171. Vue.js介绍Vue.js是一个轻巧、高性能、可组件化的MVVM库,同时拥有非常...Vue的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和 Vue生态... -
vue面试有哪些插件_关于vue面试题汇总
2020-12-21 21:22:17vue的底层原理?vue组件之间的通信?JS中判断数据类型的方法有几种?最常见的判断方法:typeof判断已知对象类型的方法: instanceof根据对象的constructor判断: constructor无敌万能的方法:jquery.type()vue与... -
vue面试有哪些插件_vue面试题及答案
2021-01-16 02:23:312019 VUE前端面试题1、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-link组件。...使用router对象的params.id3、vue-router有哪几种导航钩子?答:三种,一种是全局导... -
vue面试有哪些插件_Vue常见面试题汇总
2020-12-21 21:22:11Vue框架常见面试题1、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-link组件。... 使用router对象的params.id3、vue-router有哪几种导航钩子?答:三种,一种是全局导航... -
基于vue的框架有哪些
2018-10-08 14:59:11Vue开发使用的插件 Vux https://doc.vux.li/zh-CN/ VUX(读音 [v’ju:z],同 views)是基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面。 基于webpack + vue-loader + vux可以快速... -
vue面试有哪些插件_vue 前端框架面试问题汇总
2020-12-30 21:35:571 active-class是哪个组件属性。...解、在router目录下的index.js文件中,对path属性jiashang/:id 使用router对象的params.id3 Vue-router有几种导航钩子?解,三种。第一种是全局导航钩子。rout... -
vue面试有哪些插件_2018前端VUE面试题总结
2020-12-21 21:22:162018前端VUE面试题总结发布时间:2018-06-08 05:41,浏览次数:1547, 标签:VUE1、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-link组件。2、怎么定义vue-router的动态路由?怎么... -
vue-cli4默认配置的插件有哪些 / 修改与确认插件配置方法(webpack chain)
2020-07-30 02:28:33前言 之前我们在 《 vue-cli创建项目后优化更...我们导出看一下 vue-cli 默认都给我们配置了哪些插件 ~ 默认插件 默认插件情况(由上至下按顺序加载): 插件名 位置 环境 作用 VueLoaderPlugin vue-loader dev -
vue面试有哪些插件_vue.js面试题整理
2020-12-21 21:22:12Vue.js面试题整理一、什么是MVVM?MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑;View 代表UI 组件,它负责将数据模型转化成UI 展现... -
vue面试有哪些插件_vue前端框架面试问题汇总,附答案
2021-01-16 02:23:321、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-link组件。... 使用router对象的params.id3、vue-router有哪几种导航钩子?答:三种,一种是全局导航钩子:router.... -
vue面试有哪些插件_Vue实战面试知识点汇总
2020-12-21 21:22:101. 双向绑定详解2.computed 的实现原理1)为什么需要computed?template 使用大量复杂的逻辑表达式处理数据,使得代码维护性差,且相同数据重复计算对性能开销大2)计算属性的实现原理?1.初始化 data 和 computed,分别... -
vue面试有哪些插件_Vue.js面试题整理
2020-12-21 21:22:12MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑;View 代表UI 组件,它负责将数据模型转化成UI 展现出来,ViewModel 是一个同步View ... -
vue面试有哪些插件_20 道必看的 Vue 面试题|原力计划
2020-12-21 21:22:14MVVM 是 Model-View-ViewModel 的缩写,MVVM 是一种设计思想。Model 层代表数据模式,也可以在 Model 中定义数据修改和操作的业务逻辑;View 代表 UI 组件,它负责将数据模型转化为 UI 展现出来,ViewModel 是一个... -
vue面试有哪些插件_从面试到入职
2020-12-13 09:31:39从面试到入职,这些问题都是我面试被问到的,希望能够帮到你Vue中computed 和 watch 的区别?什么是原型链,举个例子,并说明?什么是闭包,举个例子说明,它有什么作用?1rem等于多少px?Vue 中的通信方式?Vuex 中... -
vue面试有哪些插件_Vue常见面试题整理【值得收藏】
2020-12-21 21:22:09不然,稍微有水平的面试官一看就能看出,是否有真才实学还是刚好背中了这道面试题。(都是一些基础的vue面试题,大神不用浪费时间往下看)一、对于MVVM的理解?MVVM是Model-View-ViewModel的缩写。Model :代表数据... -
vue面试有哪些插件_关于前端Vue框架的面试题,面试官可能会问到哪些。?
2020-12-21 21:22:16这年头,程序员面试都讲究坐姿,姿势不对,努力白费。参照下图,请同学们对号入座。回想一下,自己平时面试的坐姿,你在面试官眼里,大概是什么形象,可能是工程师,也可能是键盘...01.粉丝来信前段时间,有小伙伴在...
-
电子背散射衍射技术原理与应用 哈尔滨工业大学.pdf
-
位运算小技巧
-
C[Error]
-
i5-10600KF-华硕B460mpro-RX580(OC0.6.5+0.6.7开发版带主题).7z
-
MySQL 管理利器 mysql-utilities
-
异步电机矢量控制模型——matlab自带
-
jdk1.8-Linux版备份.zip
-
华为1+X——网络系统建设与运维(中级)
-
Oracle_11g_Linux到Linux_DataGuard部署
-
自动驾驶学习
-
三级导航栏
-
MySQL 索引
-
unidac_8.4.1_d27pro(delphi 10.4)
-
DDR4_JESD79-4.7z
-
cheng-06、初始化失败_Destroying singletons报错问题
-
VMware vSphere ESXi 7 精讲/VCSA/VSAN
-
activity劫持
-
MySQL DML 语言(插入、更新与删除数据)
-
MySQL 高可用工具 DRBD 实战部署详解
-
错题整理