VsCode中ctrl+s后会在当前目录下自动生成dist目录的方法_相关技巧

来源:脚本之家  责任编辑:小易  

1.智能感知vscode使用DefinitelyTyped进行自动完2113成所以需要先安装tsd,命令:npm install -g tsd安装完成后,首5261先安装node基本语法支持4102tsd query node --action install然后根据使用的modules安装,1653相应的支持,例如express的tsd query express --action install具体的包可以到这里查询:http://definitelytyped.org/tsd/安装完毕后会在项目的目录中新建typings目录,里面保存相应的包。2.启动项目vscode会根据launch.json来进行项目的启动,通过launch.json配置,不仅可以进行nodejs的项目启动,还可以进行其他代码的启动,包括php等,php的我会在下篇文章介绍,这里需要注意的是launch.json,是存放在.vscode目录内的不要搞错。3.代码调试首先要点击vscode右侧的debug标签,找不到的按ctrl-shift-E,或者直接按F5,启动调试,这样就可一开始调试跟踪了。编辑器的右侧会有debug的console可以查看输出,左侧的变量监控做的也非常不错。最后小技巧:快速打开项目由于vscode没有项目的sln文件,所打开项目比较麻烦(其实不麻烦,我比较懒),这里介绍一个简单的方法新建一个bat文件start-ide.bat(名字不要与系统命令重复例如cmd,start,否则就无限循环了),内容如下:start code .这样点击这个bat文件会打开2个窗口,一个目录是项目根目录的cmd窗口可以方便的输入命令、一个打开项目根目录的vscode的编辑器,这样就可以愉快的开始玩耍了。另外:mongo-express管理mongodb还不错,找不到好的管理工具的可以试试www.zgxue.com防采集请勿采集本网。

VsCodectrl+s后会在当前目录下自动生成dist目录

rd /s /q "C:\Microsoft VS Code\Work_Space_C++\.vscode\ipch" 保存为.bat文件,加入开始启动菜单里就可以了,这样每次开机就会删除这个文件夹 或者 用at 命令添加个任务计划 这样系统就会自动每天定时运行这个bat文件了 这个很简单的 你一看就

后会在当前目录下自动生成目录

解决办法:关闭compile-hero插件

问题的原因:fdir = "/Desktop/"这个路径的意义是在根目录下找"Desktop"文件夹。这是绝对路径。相对路径请用"./Desktop/"或"Desktop/"。 另外,程序员你好意思把处理的文件放在桌面文件夹?无论在什么系统,这都绝不是一个好习惯。

在设置中搜索compile-hero插件

打开 cmd 查找自己的 git 安装路径 >where git C:\Program Files\Git\cmd\git.exe 打开 vscode 设置,在右侧用户配置中添加如下 "git.path": "C:\\Program Files\\Git\\cmd\\git.exe" 覆盖默认 git.path 配置,此处后面参数需要和你的 git 安装路

关闭所有自动生成dist目录的选项(如下图所示)

一、使用Express创建项目[这两步都在dos 模式下执行] 1,安装全局的Express!(已安装请忽略) npm install -g express 2,创建项目 创建项目(创建文件夹名称ExpressApp) express ExpressApp 小插曲:如果你习惯了Linux下的环境,你可以在自己电脑

关闭插件

PS:下面看下vue项目Ctrl+s vscode代码自动格式化

1、直接按F5可以调试的方法或者点击运行按钮(可以直接运行html文件或者js文件) 在launch.json文件中的配置如下: { "version": "0.2.0", "configurations": [{ "name": "谷歌浏览器", //运行html文件,用谷歌浏览器打开 "type": "chrome", "re

前言

多人开发vue项目,代码风格形式不一

vscode保存代码,自动按照eslint规范格式化代码设置(vscode最新版配置)

vscode插件

首先vscode需要装一些vscode插件

ESLint、Vetur、Prettier-Code formatter、GitLens-Git supercharged

配置settings.json

打开settings.json,贴上配置,注意自己原有的vscode主题和字体等不要替换掉

打开方式

方式一:

1)文件 ------.>【首选项】---------->【设置】

2)搜索emmet.include;

3)在settings.json下的【工作区设置】中添加

方式二:

Ctrl + P 搜索settings.json

贴上如下配置

{ "window.zoomLevel": 0, "diffEditor.ignoreTrimWhitespace": false, "workbench.colorTheme": "One Monokai", "editor.fontSize": 14, "workbench.editor.enablePreview": true, //预览模式关闭 "editor.formatOnSave": true, // #每次保存的时候自动格式化 // 自动修复 "editor.codeActionsOnSave": { "source.fixAll.eslint": true, }, "eslint.enable": true, //是否开启vscode的eslint // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #去掉代码结尾的分号 "prettier.semi": false, // #使用单引号替代双引号 "prettier.singleQuote": true, // #让prettier使用eslint的代码格式进行校验 "prettier.eslintIntegration": true, "javascript.preferences.quoteStyle": "double", "typescript.preferences.quoteStyle": "double", // #让函数(名)和后面的括号之间加个空格 "javascript.format.insertSpaceBeforeFunctionPare

到此这篇关于VsCode中ctrl+s后会在当前目录下自动生成dist目录的方法的文章就介绍到这了,更多相关VsCode当前目录下自动生成dist目录内容请搜索真格学网以前的文章或继续浏览下面的相关文章希望大家以后多多支持真格学网! 您可能感兴趣的文章:vscode写python时的代码错误提醒和自动格式化的方法vscode 配置vue+vetur+eslint+prettier自动格式化功能vscode配置vue下的es6规范自动格式化详解Vue-cli Eslint在vscode里代码自动格式化的方法

简介VSCode是微软2113出的一款轻量级代码编辑器,免费而5261且功能强大,对4102JavaScript和NodeJS的支持非常好,自带很多功能,例如代码1653格式化,代码智能提示补全、Emmet插件等。VSCode推荐一个项目以文件夹的方式打开。一、设置首选项下载安装完成后,打开编辑器,首先要设置主题、字体大小等。1. 设置主题文件→首选项→颜色主题2. 设置字体大小文件→首选项→设置,打开了一个setting.json文件,将左边的设置复制到右边进行覆盖生效,所有编辑器的设置都在这里修改。 二、Emmet插件最新版集成了Emmet 2.0,在文件→首选项→设置可以开启或者关闭功能 三、快捷键所有快捷键设置:文件→首选项→键盘快捷方式 1. 在当前行中间换行到下一行:ctrl+enter 2. 当光标点击到某一行时,默认选中全行,可以直接复制剪切 3. 直接删除某一行:shift+delete或者ctrl+shift+k 4. 多行光标选择:alt+鼠标左键 5. 自动生成html结构和meta声明:首先输入“!”,然后按tab键 6. 标签自动补全:tab键 7. 折叠所有代码:ctrl+k、ctrl+0 8. 拆分编辑器:ctrl+\查找框右边的3个参数分别为:区分大小写,全字匹配,使用正则9. 跳转行号:ctrl+G 10. 添加函数注释:在函数上方输入“/**”,然后点击enter11. 格式化:alt+shift+f 12. 注释:ctrl+/ 13. 全部保存:ctrl+k, 然后只按s一个键 14. 向上移动一行:alt+↑ 15. 向下移动一行:alt+↓ 16. 向上复制一行:alt+shift+↑ 17. 向下复制一行:alt+shift+↓ 18. 查找:ctrl+F 19. 替换:ctrl+H 20. 文件中查找:ctrl+shift+f 可以在打开的文件夹中搜索所有文件内容 21. 文件中替换:ctrl+shift+h 22. 转到定义:F12 23. 转到实现:ctrl+F12 24. 打开文件夹:ctrl+k, ctrl+o 25. 关闭文件夹:ctrl+k, 然后单按一个f 26. 选中一段代码,通过“ctrl+[”可以左移,“ctrl+]”可以右移open in browser插件功能描述:从浏览器中查看html文件,使用系统的当前默认浏览器Atuo Rename Tag修改 html 标签,自动帮你完成尾部闭合标签的同步修改,不过有些bug。fileheader顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间Live Sass Compilervscode--搭建自动编译sass环境一,安装插件及使用步骤1、vscode安装Live Sass Compiler,由于该插件依赖Live Server ,所以会自动安装Live Server2、点击vscode底部的Watch my Sass3、按F1键,在输入栏中输入Live Sass: Watch Sass来监听Sass文件( Live Sass: Stop Watching Sass 停止监听文件)4、同样在输入栏中输入 Live Sass: Compile Sass - Without Watch Mode,就会自动编译scss文件为css文件二,配置编译规则1、在项目的根目录下创建一个文件夹,命名为 .vscode(只能通过Linux命令创建),并且在该文件夹下面创建一个文件settings.json2、配置settings.json1 {2 "liveSassCompile.settings.savePath": "./dist/css",//指定编译完的css文件路径3 "liveSassCompile.settings.format": "expanded",//指定编译css的样式类型,有这四种 expanded(默认), compact, compressed or nested4 "liveSassCompile.settings.extensionName": ".css",//指定编译完的文件后缀名,.css为普通代码,.min.css为压缩代码5 "liveSassCompile.settings.excludeFolders": [6 "**/node_modules/**",//指定忽略的文件7 ".vscode/**"8 ]9 }三、其他注意事项如果要对多个文件进行监听和编译,那么只要重复操作一,安装插件及使用步骤》的2/3/4步骤。(每个scss文件只要操作一次,以后一旦保存,就会自动编译)Easy Sass安装 Ruby 时一定要勾选 Add Ruby executables to your PATH,用来将 Ruby 添加到系统变量,这样后续可以省却很多不必要的麻烦。装好后在命令行输入 gem sass 来安装 Sass,安装完成后启动 VSCode,在拓展商店里搜索“easy sass”,并安装,安装成功后重启 VSCode。接下来进行配置。在 VSCode 菜单栏依次点击“文件 首选项 设置”,打开 settings.json 全局配置文件。搜索“easysass”,然后把 easysass 相关的设置项复制到右侧的用户设置编辑窗口中,再根据实际情况修改配置项。一般生产环境中用到其中两个设置项(上图红框处中的代码):/** Easy Sass 插件 **/"easysass.formats": [{"format": "compressed", // 压缩"extension": ".css"}],"easysass.targetDir": "./" // 自定义css输出文件路径12345678其中 easysass.formats 是设置编译输出的 css 风格的,可以同时编译输出多个不同风格的 CSS 文件,此处我只设置了一个 easysass.formats 项目,所以编译时只生成一个 CSS 文件。easysass.formats[i].format 支持四个选项用以编译生成对应风格的 CSS:nested:嵌套缩进的 css 代码。expanded:没有缩进的、扩展的css代码。compact:简洁格式的 css 代码。compressed:压缩后的 css 代码。easysass.formats[i].extension 顾名思义就是设置编译输出的文件名了,此处可以自定义文件名,输出的 CSS 文件名会按照“当前 Sass 文件名(不含拓展名)+此处自定义文件名”的格式来生成。例如:设置 easysass.formats[i].extension 为 ".min.css",假设当前的 Sass 文件名为“style.scss”,则编译输出的 CSS 文件名为“style.min.css”。我们的生产环境中,在很多情况下 Sass 文件和 CSS 文件是不在同一个目录下的,而Easy Sass 默认输出的 CSS 是和当前 Sass 文件处于相同目录的,为此我们需要配置输出路径内容来自www.zgxue.com请勿采集。


  • 本文相关:
  • html5 移动页面自适应手机屏幕宽度详解
  • visual studio和visual studio code之间有什么区别
  • git push 本地项目推送到远程分支的方法(git命令版)
  • vscode代码格式化和eslint的使用
  • 算法系列15天速成 第一天 七大经典排序【上】
  • 关于base64编码的原理及实现方法分享
  • 详解hadoop2.7.2 编译64位源码
  • 使用ssh快速下载git项目的实现方法
  • 抓包工具fiddler的使用方法详解(fiddler中文教程)
  • 完美解决webstorm启动索引文件卡死的问题
  • vs code快速生成HTML头部快捷键或者插件?
  • vscode中node.js开发和扩展开发的区别
  • vscode使用python中的open函数创建出来的文件为什...
  • vscode 在ctrl加单击后搜索定义方法时候 如果搜索...
  • 请教大神,如何每天自动删除一个文件夹,C:\Microsof...
  • 用的VScode里面的python读取不到存在的文件
  • vscode中怎么修改git定位的目录
  • 如何在vscode中使用nodejs
  • vscode怎么运行javascript
  • 使用VScode为什么不能在对象中放对象
  • 网站首页网页制作脚本下载服务器操作系统网站运营平面设计媒体动画电脑基础硬件教程网络安全javascriptasp.netphp编程ajax相关正则表达式asp编程jsp编程编程10000问css/htmlflex脚本加解密web2.0xml/rss网页编辑器相关技巧安全相关网页播放器其它综合dart首页vscode写python时的代码错误提醒和自动格式化的方法vscode 配置vue+vetur+eslint+prettier自动格式化功能vscode配置vue下的es6规范自动格式化详解vue-cli eslint在vscode里代码自动格式化的方法html5 移动页面自适应手机屏幕宽度详解visual studio和visual studio code之间有什么区别git push 本地项目推送到远程分支的方法(git命令版)vscode代码格式化和eslint的使用算法系列15天速成 第一天 七大经典排序【上】关于base64编码的原理及实现方法分享详解hadoop2.7.2 编译64位源码使用ssh快速下载git项目的实现方法抓包工具fiddler的使用方法详解(fiddler中文教程)完美解决webstorm启动索引文件卡死的问题2019最新的pycharm激活码(推荐)进制转换算法原理(二进制 八进制eclipse 格式化代码时不换行与自微信小程序设置http请求的步骤详几款开源的中文分词系统从console.log说起(console.log详十进制负数转换为二进制、八进制url 长度有限制吗?git 撤销操作、删除文件和恢复文idea+git合并分支解决冲突及详解步骤github入门教程 手把手教你最简单的开源项gitee的下载安装配置及使用步骤详解在vscode中如何配置python开发环境详解git merge命令应用的三种情景网站性能优化之http请求过程简述风中叶老师讲述的学习方法(学习编程的朋友千万要避免的五种程序注释方式小结使用vscode如何从github拉取项目的实现基于git的常用撤销技巧与解决冲突方法(推
    免责声明 - 关于我们 - 联系我们 - 广告联系 - 友情链接 - 帮助中心 - 频道导航
    Copyright © 2017 www.zgxue.com All Rights Reserved