zoukankan      html  css  js  c++  java
  • VSCode基本使用

    1.下载与安装

    下载地址:https://code.visualstudio.com/Download

    安装:下载了exe的文件后直接安装即可。

    2.常用快捷键

    命令

    说明

    F1或Ctrl+Shift+P

    主命令框

    Ctrl+Shift+N

    新开一个VScode编辑器

    Ctrl+C -> Ctrl+V

    复制当前行

    Shift+Alt+F

    代码格式化

    Ctrl+Shift+L

    同时对选中的内容进行内容匹配后编辑

     Ctrl+F

     查找

    Ctrl+H

     查找替换

     Ctrl+Shift+F

     整个文件夹中查找 

    3.基本使用

    3.1VSCode自定义vue文件模板

    1)依次打开“文件 ——> 首选项 ——>用户代码片段”,输入html或html.json,回车,在里面添加下面的代码后保存(这是自定义的,可以根据实际情况修改)

    "Print to console": {
                "prefix": "myv",
                "body": [
                    "<template>",
                    "  <div>",
                    "",
                    "  </div>",
                    "</template>",
                    "",
                    "<script>",
                    "",
                    "export default {",
                    "  name:'',",
                    "  components: {},",
                    "  computed: {},",
                    "  created() {},",
                    "  data() {",
                    "      return {",
                    "",
                    "      }",
                    "  },",
                    "  methods: {",
                    "",
                    "  },",
                    "}",
                    "</script>",
                    "",
                    "<style scoped>",
                    "$4",
                    "</style>"
                ],
                "description": "Log output to console"
            }

    2)新建一个vue的文件,在开头输入myv回车,即可生成模板文件,输入如图。

    3.2VSCode中代码提交到git

    1)打开从git上拉取的项目,会看到在左下角有一个master,这表示已经和github连接了

     2)选择v型图标,输入代码的提示,点击对号将代码提交到本地仓库

     3)点击对号后面的三个点,选择push,把本地仓库的代码提交到远程仓库,可能需要输入github的用户名和密码。

     4)每次提交都输入用户名和密码显得很麻烦,可以进行设置。在命令终端输入

    git config --global credential.helper store

    3.3VSCode格式化Vue,代码会自动加上分号的问题

    在对vue文件进行格式化的时候,vscode会在代码后面自动加上分号,看着不输入,语法也不通过。解决办法如下:

    打开设置(文件 ——> 首选项 ——>设置),输入vetur.format.defaultFormatter.js,把prettier改为prettier-eslint。

    3.4VSCode写VUE代码 注释 html出现 //

    安装Vuter插件即可。

    3.5VSCode中VUE.JS的HTML代码如何实现自动补全

    1)下载HTML Snippets插件

    2)打开File—>Preferences---->settings,输入:files.associations回车搜索

    3)在files.associations{ }里面中加入

    "*.ejs":"html",
    "*.vue":"html"

    3.6自动完成头部和尾部闭合标签的同步修改

    安装插件Atuo Rename Tag即可。

    3.7配置同步

    一台电脑配置好之后,其它的几台电脑都不用配置,只要登录一下就搞定。安装Settings Sync插件。

    3.8简体中文界面

    将界面转换为中文。安装Chinese (Simplified) Language Pack for Visual Studio Code插件,然后重启即可。

    3.9通过服务器打开html文件

    安装Live Server插件,然后在需要运行的html文件中右键,选择Open with Live Server即可。

    就是这么简单,你学废了吗?感觉有用的话,给笔者点个赞吧 !
  • 相关阅读:
    iframe的两种通信方式,iframe的history的优先级
    React-router 将弹框Modal嵌入路由(create a modal route with react-router)
    vue 项目构建 + webpack
    vue 生命周期,v-bind 和 v-on的区别(或 : 和 @的区别),以及父传子、子传父的值传递方式
    linux上配置Sonar代码扫描
    玩转jenkins
    程序小猿的rpa----艺赛旗阶段
    学习完level3加入了uipath家庭,欢迎交流学习。小清风的rpa
    程序员小时光的rpa成长之路(艺赛旗)
    数学期望
  • 原文地址:https://www.cnblogs.com/zys2019/p/13184840.html
Copyright © 2011-2022 走看看