本文关键词：前端写代码用什么软件

干建站这行七年了，见过太多刚入行的小兄弟，上来就问：“哥，前端写代码用什么软件啊？” 每次听到这问题，我都想笑。这就像问“吃饭用什么筷子”一样，没标准答案，只有适不适合你。以前我也纠结过，换了好几个编辑器，最后发现，工具只是工具，关键是你得知道怎么用它干活。今天不整那些虚头巴脑的参数对比，就聊聊我实战里觉得最顺手的几个，顺便说说怎么配环境，让你少掉点头发。

首先得明确一点，别去下那些所谓的“全能型”IDE，除非你做的是大型Java项目。做前端，尤其是现在搞Vue、React这些单页应用，轻量、快、插件多才是王道。

第一步，先把VS Code（Visual Studio Code）装上。这是目前前端圈子里的绝对主流，微软出的，免费，开源，社区活跃。别听有些人说Sublime Text快，那是以前，现在VS Code的生态早就把Sublime甩几条街了。下载安装包很简单，去官网下就行，注意选对应你系统的版本。装的时候一路下一步，别勾选那些乱七八糟的额外软件，容易装垃圾。

第二步，装完别急着写代码，先装插件。这是VS Code的灵魂。我推荐必装的几个：Live Server，这个神器能让你的HTML修改后自动刷新浏览器，不用手动F5，省下的时间都能多喝两杯咖啡了；Prettier，代码格式化插件，强迫症福音，代码写得再乱，保存一下自动排版整齐；还有ESLint，帮你检查语法错误，虽然有时候报错挺烦人，但能帮你避免低级bug。至于中文插件，装个“Chinese (Simplified) Language Pack”吧，看着亲切点，虽然英文界面也不难懂。

第三步，配置你的工作流。很多人装了软件就开始瞎写，这是大忌。建议你先建个文件夹，比如叫“my-first-site”，然后在VS Code里打开这个文件夹。别直接打开单个文件，VS Code是按“工作区”来管理的。打开后，在左侧资源管理器里右键，选“在新终端中打开”。这时候你会看到底部的终端窗口，输入npm init -y，初始化一下项目。虽然你现在可能只写静态页面，但养成用npm管理依赖的习惯，以后搞前端写代码用什么软件这个问题时，你就知道为什么大家都推荐这套组合了。

第四步，开始写第一个HTML文件。新建index.html，随便敲点内容，比如

Hello World

。然后右键这个文件，选“Open with Live Server”。浏览器会自动弹出来，显示你的内容。这时候你改一下h1里的字，保存，浏览器立马变。这种即时反馈的感觉，才是前端开发的乐趣所在。

当然，除了VS Code，也有人喜欢WebStorm。这玩意儿是JetBrains家的，功能强大，智能提示做得比VS Code好，特别是重构代码的时候。但缺点是吃内存，电脑配置不好的话，打开个项目能卡半天。而且它是收费的，虽然可以破解，但我不建议新手用盗版，万一哪天项目突然崩了，数据没了哭都找不到调。对于预算充足、电脑配置高的朋友，WebStorm也是个不错的选择，毕竟它内置了很多调试工具，不用像VS Code那样到处找插件。

还有个问题，很多人纠结要不要装HBuilder。说实话，HBuilder对新手挺友好的，内置了很多模板，拖拽就能生成页面。但它的代码提示和智能程度远不如VS Code和WebStorm。如果你只是做个简单的静态展示页，HBuilder确实快。但如果你想深入学前端，或者以后要接商业项目，还是建议尽早转战VS Code。因为大厂用的都是VS Code或者WebStorm，你习惯了别人的工具，入职后上手也快。

最后说句心里话，选什么软件不重要，重要的是你开始动手写。别在选工具上花太多时间，花一周时间纠结，不如花一小时写出一个能跑的页面。代码写得多了，你会发现，工具只是辅助，逻辑和思维才是核心。

总之，前端写代码用什么软件，我的建议是：新手无脑入VS Code，配好Live Server和Prettier，够你用到毕业。等你对代码结构有了深刻理解，再考虑要不要换更重型的工作流。别怕报错，报错是常态，解决报错的过程，就是你成长的过程。加油吧，码农们。