我把最近这段期间有空时摸索的历程做了一份笔记， 不算碰到很多功能仅尽量列出 笔记网页版 http://www.evernote.com/l/AKDvxt1GSNJO8YJnH7NwBxxsWHE-CdAJA4c/ 网页应该比较好读 之後我有更新内容这里会自动看到，不过我猜应该不会增加多少内容 ------------- 底下就把笔记内容原文贴上 VSCode 纪录一下最近使用的一些历程 这算是闲暇时间去用的，应该只碰到少部分的功能，就尽量纪录列出 之後若我有空有碰到新东西觉得要记录的话会持续新增到这个网页版的笔记 ------ 我使用到後来，有时想到一些功能建议会在VSCode上按Help > Search Feature Requests 然後就会到 https://github.com/Microsoft/vscode/issues?q=is%3Aopen+is%3Aissue+label%3Afeature-request+sort%3Areactions-%2B1-desc 上面可以看到很多issue并且持续有人在提出建议或问题 想看最新的issue 可以点Sort>Newest 於是我了解到他有点算是还在发展中未完全成熟的IDE，感觉有些地方还不够完整 举两个问题 1. JS intellisense doesnt work in HTML script tag - VSCode GitHub Issues #4369 http://stackoverflow.com/questions/37055382/how-to-enable-intellisense-for-javascript-in-visual-studio-code 1. Create an HTML file and a <script type="text/javascript> ....... </script> block. 2. Start coding in the block then you will see intellisense doesnt work. https://github.com/Microsoft/vscode/issues/4369 另外在html中 Ctrl+K+C是会产生 <!-- -->注解符号 可是对於放在html 中的javascript 就不会自动侦测要使用 // 当注解符号，一样用 <!-- -->，这我觉得有点太不方便了 2. 201606-201610左右 Win10的VSCode终端机 很奇怪启不起来 会有异常 Integrated terminal does not launch when project folder contains special/unicode characters #7727 https://github.com/Microsoft/vscode/issues/7727 我之前还以为这个问题会持续很久 但是刚刚再看发现竟然在八天前约2016/10月初被解掉了 从之前issue讨论过程中的质疑可以略为感受到开发中的氛围 ugros commented on 9 Sep ‧ edited I've already opened an issue to this exact same problem 3 months ago. It was closed, because for Tyriar everything seemed to work fine. I've tried VScode on 3 different computers, with both powerShell and cmdprompt, with default settings, and it never worked. In fact, I've never seen a Windows computer that had integrated terminal working. I think I'm switching back to an IDE that can handle basic stuff. Microsoft member Tyriar commented on 9 Sep ‧ edited @ugros many people are experiencing this issue as you can see from the linked issues. This issue is actually on the integrated terminal backlog (#9959) and is one of the major bugs I'll be looking at in September. Keep in mind we're quite a small team with a lot of responsibilities, there is only so much we can do each release. Also I can't see your original issue? https://github.com/Microsoft/vscode/issues/created_by/ugros 不过竟然被解掉了，出乎我意料之外 Tyriar added the help wanted label on 20 Sep Tyriar modified the milestone: Backlog, September 2016 on 20 Sep This was referenced 27 days ago Closed Terminal dont work,wenn folder is open [email protected] #12483 Closed Terminal Process terminated if the folder contains Chinese characters #13013 the-ress commented 8 days ago I've created a pull request with the fix here: chjj/pty.js#176 Tyriar referenced this issue 8 days ago ClosedCan't open terminal when opening a Chinese named directory #13549 Tyriar modified the milestone: October 2016, Backlog 8 days ago Tyriar added a commit that closed this issue 8 days ago Tyriar closed this in 74d0241 8 days ago Microsoft member Tyriar commented 8 days ago Fixed thanks to @the-ress's pull request! You can try this out in the Insiders build tomorrow or in stable v1.7. 另外从Release Note https://code.visualstudio.com/updates/v1_6 我是可以感受到每个月都仍然有许多新功能不段的在释出，所以觉得VSCode仍算是蓬勃发 展中的一个编辑器 从左边侧栏的年月来看应该是201506开始发展的 到目前一年多 不过整体来说，已经完成的功能事都还不错 但我对其他同类型编辑器还不熟悉就无法提供比较 以上前情提要完毕 ------------ 以下是摸索过程的一些纪录 (只列出我碰到的功能满少的，完整功能请自行查看官方文件or估狗大神!) == MarketPlace 算是一个涵括各种扩充功能的地方、市集之类的 https://marketplace.visualstudio.com/ 其中包含了 == Theme 有比内建更丰富的Theme(布景、字体配色)可以选择 https://marketplace.visualstudio.com/vscode/Themes?sortBy=Downloads 每个Theme点进去会有介绍，并且会有安装教学 Installation Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter. 装了上方extension的theme之後， 还是要CtrlShiftP>>打Theme然後去选，选单里会出现新安装的Theme可以直接选用 == 快速键 Ctrl+K+C 注解游标所在行or反白部分 Ctrl+K+U 取消注解游标所在行or反白部分 快速复制单行 The commands your are looking for are editor.action.copyLinesDownAction and editor.action.copyLinesUpAction. You can see the associated keybindings by picking File |Preferences | Keyboard Shortcuts. The keybinding is Shift+Alt+Down and Shift+Alt+Upon Windows How do I duplicate a line within Visual Studio Code? http://stackoverflow.com/questions/30203752/how-do-i-duplicate-a-line-within-visual-studio-code Shift+Delete 直接删掉游标所在行 Alt+Z 切换word wrap How to switch word wrap on and off in VSCode? http://stackoverflow.com/questions/31025502/how-to-switch-word-wrap-on-and-off-in-vscode Code自动排版 -- On Windows, code formatting is available in VSCode through the shortcut SHIFT+ALT+F http://stackoverflow.com/questions/29973357/how-do-you-format-code-in-visual-studio-code-vscode Ctrl 加 - / = 放大、缩小画面 Ctrl+B 显示隐藏侧蓝 这里有罪完整快速键列表、 和教你如何自定义各种shortcut(见满下方Customizing Shortcuts 条目) 也就是你可以把shortcut改成你想要的按键组合，透过修改一个shortcut配置档 https://code.visualstudio.com/Docs/customization/keybindings Customizing Shortcuts All keyboard shortcuts in VS Code can be customized via the User/keybindings.json file. * To configure keyboard shortcuts the way you want, go to the menu under File > Preferences >Keyboard Shortcuts. (Code > Preferences > Keyboard Shortcuts on Mac) * This will open the Default Keyboard Shortcuts on the left and your User/keybindings.json file where you can overwrite the default bindings on the right. == The Basics of Visual Studio Code https://code.visualstudio.com/Docs/editor/codebasics === VS Code comes with a built-in JavaScript/TypeScript language service so you get JavaScript and TypeScript code intelligence out-of-the-box. For other languages, like Go, Python, and C#, you will need to install an extension for deep language service integration. Language services provide the code understanding necessary for features like IntelliSense (suggestions) and smart code navigation (Go to Definition, Find All References, Rename Symbol). Different language extensions provide different levels of support for VS Code's language features but rest assured the community is very active adding new languages and great functionality. Learn more about installing VS Code extensions in our Extensions Marketplace topic and visit the Marketplace to see what's available for your favorite programming languages. == 10 Awesome Features of Visual Studio Code http://developer.telerik.com/featured/10-awesome-features-of-visual-studio-code/ 8 Powerful Visual Studio Code Extensions for Front-end Developers http://www.hongkiat.com/blog/visual-studio-code-extensions/ == Task https://code.visualstudio.com/docs/editor/tasks == Open file by browser 在VSCode按快速键就能直接用浏览器启动档案 How to Launch Files in a Browser from Visual Studio Code https://www.webucator.com/blog/2016/06/launch-files-browser-visual-studio-code/ How to view my HTML code in browser with Visual Studio Code? http://stackoverflow.com/questions/30039512/how-to-view-my-html-code-in-browser-with-visual-studio-code For Windows - Open your Default Browser - Tested on VS Code v 1.1.0 Answer to both opening a specific file (name is hard-coded) OR opening ANY other file. Steps: 1- Use ctrl+shift+p to open "Command Palette". 2- Type in Configure Task Runner, then click Enter. The tasks.json file opens up, delete the script displayed and replace it by the following: { "version": "0.1.0", "command": "explorer", "windows": { "command": "explorer.exe" }, "args": ["test.html"]} 3- Save it ctrl+s. 4- Switch back to your "test.html" (the name of your html page), and press ctrl+shift+b to view your "test.html" page in your Web Brower. *Note (to clarify): If your html file name is i.e. "forms.html", then change "args":["test.html"] to"args":["forms.html"]. * IMPORTANT (very useful): To open ANY html file that is open in your VS Code Explorer, then change "args":["test.html"] to "args": ["${file}"]. *Note: ["{$file}"] does not work. ["${file}"] Works! To Configure Task in a new folder: Select the Tasks: Configure Task Runner command and you will see a list of task runner templates. Select Others to create a task which runs an external command. . . . You should now see a tasks.json file in your workspace .vscode folder with the following content: . . . by http://code.visualstudio.com/Docs/editor/tasks == 入门影片 活用 Visual Studio Code https://channel9.msdn.com/Series/Mastering-Visual-Studio-Code or youtube查查 Visual Studio Code Beginner/Tutorial 等等 == set UI language Display Language https://code.visualstudio.com/docs/customization/locales == Intellisence https://code.visualstudio.com/docs/languages/php#_debugging you can search for PHP extensions from within VS Code by running the Extensions: Install Extension command (Ctrl+Shift+P and type ext install) then filter the extensions drop down list by typing php. 要改成其他语言就把上面做法中的php换掉就可以了 php堆荐 Crane php intellisence html推荐 html snippet Intellisense 属於外挂程式 要安装外挂程式 或看你装了那些外挂程式 就想外挂跟extension这单字有关 所以Ctrl+Shift+P再打ext就可以看到 install extension/ show all installed extension的选项了 然後再打关键字搜寻，例如想查html相关外挂 就打html 下面就会列出很多 也可以下html intelli 就会列出相关的外挂 == 装了extension之後， 像是要打 <table></table> 就只要先打 ta 这时下拉选单出现table 再按一下Tab intellisense会帮你输入成 <table> </table> 就可以了，相当省力 == Editing TypeScript TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. It offers classes, modules, and interfaces to help you build robust components. A language specification can be found here. 这部分我还不太熟，只是有看到就先记一下 https://code.visualstudio.com/docs/languages/typescript#_using-newer-typescript-versions == Editing - Smart IntelliSense Parameter Hints Hover Go to Definition Goto Symbol Open symbol by name Peek Bracket matching Reference information Rename symbol Errors & Warnings Folding https://code.visualstudio.com/docs/editor/editingevolved -- ~ Sent from my PCMan Combo ~ --

※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 114.42.76.236 ※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Programming/M.1476982819.A.A81.html ※ 编辑: name2name2 (114.42.76.236), 10/21/2016 01:28:57