位置: IT常识 - 正文
Vs Code配置前端环境及运行(vscode前端必备扩展)
编辑：rootadminVs Code配置前端环境及运行 Vs Code配置前端环境及运行Vs Code环境配置下载Vs Code安装Node安装npm安装Live Server运行前端程序其他插件Vs Code环境配置下载Vs Code
本文链接地址:https://www.jiuchutong.com/zhishi/299259.html
转载请保留说明！
推荐整理分享Vs Code配置前端环境及运行(vscode前端必备扩展)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vscode前端如何调用后端接口,vscode写前端有哪些插件,visual studio code前端,vscode写前端有哪些插件,vscode写前端有哪些插件,vscode写前端有哪些插件,vs code 前端,vs code 前端,内容如对您有帮助，希望把文章链接给更多的朋友！
链接：官网地址 进入官网点击-> Download for Windows，即可下载；如果是苹果或Linux操作系统，点击-> Download for Windows的箭头就可以选择对应的版本。或者直接在电脑管家的软件管理下载都可。
安装Node链接：官网地址
建议安装16.18稳定版 测试是否安装成功：
node -v 查看node的版本npm -v 查看npm的版本(新版的node安装自带安装npm) win+R，输入cmd，进入命令提示窗。 查看到版本号，则安装成功。安装npm打开Vs Code，点击->拓展，在搜索栏里搜索npm。 安装下图的插件即可，我这里已经安装好了。
安装Live Server依然是在拓展里搜索Live Server，然后安装。
运行前端程序点击-> 文件 ->打开文件夹，选择代码存放的文件夹打开。 点击-> 终端 ->新建终端
安装依赖 npm install建议不要直接使用 cnpm 安装依赖，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题npm install --registry=https://registry.npmmirror.com启动服务npm run dev其他插件Debugger for Chrome, Ayu(主题扩展)Beautify(美化代码)Chinese (Simplified) (简体中文)Code Runner(单独运行某段代码)Code Spell Checker(源代码拼写检查)Easy LESS(自动将less编译为css)HTML CSS Support(用于css的智能感知)mage preview(预览图片)indent-rainbow(使缩进更容易阅读)JS & CSS Minifier (Minify)(缩小化JS和CSS)Material Icon Theme(图标主题)open in browser(浏览器打开文件)Prettier - Code formatter(代码格式化)Rainbow Brackets(彩虹括号)stylus(一种预处理器), Vetur(vue工具)vscode-icons(文件图标)vue(语法突出显示)ue 3 Snippets(代码片段扩展),vue-beautify(美化vue代码)vue-helper(vue增强)上一篇：别找了诸位 【十二款超级好用的谷歌插件都在这】(确定不来看看？）(你别找了)
下一篇：如何使用vue-cli来搭建vue项目？详细步骤跟着我来吧！(如何使用rank函数排名)