2021-09-02 10:13发布
一、安装visual studio code
也可以用像IDEA这样的集成开发环境，选vs code主要是用来写前端代码更轻便一些
二、安装插件
open in browser，通过浏览器打开，查看页面效果。
image.png
快捷键:alt+B，在默认浏览器打开，Shift+alt+B选择其他浏览器打开(这一组快捷键我这里是失效的，我改了一下默认浏览器，一般直接使用alt+B，懒得再配置了)配置自定义默认浏览器:点击左下角的配置，打开setting，搜索open-in-browser，修改配置为chrome
image.png image.png
在代码编辑区，直接用鼠标右键也会有相应的选项
image.png 三、一点补充
1、可以安装debug for chrome插件，用于设置断点在浏览器调试。安装完成之后，在代码区域按F5后，会出现调试环境的选项，同时在工作空间根目录下会生成launch.json配置文件，修改其中的代码。其中，url部分为你要调试的demo的路径，为防止写错，可以直在浏览器里打开demo文件，然后复制粘贴地址栏的即可。
image.png 2、另外，一般还需要安装node.js，相当于服务器端的JavaScript。目前还在没有学，后边再总结。3、代码书写的规范--分号问题:我们看一部分教程，包括一些论坛里的大神们，有些JavaScript代码后没有跟分号。大概了解了一下，JavaScript是有自动加分号规则的，但是如果不是真的非常了解，很容易产生歧义，所以建议在写的时候都加上分号。
最多设置5个标签!
{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','/static/images/logo.png', '推荐 汽水味的小盆友 的问题《vscode怎么搭建环境》','http://www.shouhuola.com/answer/36928/131460.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
一、安装visual studio code
也可以用像IDEA这样的集成开发环境，选vs code主要是用来写前端代码更轻便一些
二、安装插件
open in browser，通过浏览器打开，查看页面效果。
image.png
快捷键:alt+B，在默认浏览器打开，Shift+alt+B选择其他浏览器打开(这一组快捷键我这里是失效的，我改了一下默认浏览器，一般直接使用alt+B，懒得再配置了)配置自定义默认浏览器:点击左下角的配置，打开setting，搜索open-in-browser，修改配置为chrome
image.png image.png
在代码编辑区，直接用鼠标右键也会有相应的选项
image.png 三、一点补充
1、可以安装debug for chrome插件，用于设置断点在浏览器调试。安装完成之后，在代码区域按F5后，会出现调试环境的选项，同时在工作空间根目录下会生成launch.json配置文件，修改其中的代码。其中，url部分为你要调试的demo的路径，为防止写错，可以直在浏览器里打开demo文件，然后复制粘贴地址栏的即可。
image.png 2、另外，一般还需要安装node.js，相当于服务器端的JavaScript。目前还在没有学，后边再总结。3、代码书写的规范--分号问题:我们看一部分教程，包括一些论坛里的大神们，有些JavaScript代码后没有跟分号。大概了解了一下，JavaScript是有自动加分号规则的，但是如果不是真的非常了解，很容易产生歧义，所以建议在写的时候都加上分号。
一周热门 更多>