HBuilderX n/a，WebStorm 来优雅地使用 uni-app for n/a

大家好，我是小谦，一位全栈开发者，也是一位 uni-app 爱好者。

接触 uni-app 已经好几年了，uni-app 也越来越壮大，组件也日趋完善，基于 n/a 开发也已经不成问题。
但是基于 n/a 的开发，始终困扰着我一个问题，那就是开发工具的选择。

uni-app 官方首推 HBuilderX，HBuilderX 也是一个非常优秀的开发工具，但是我始终不得其法，久而久之，我始终没有办法使用 HBuilderX 进行 n/a 开发。

现在 HBuilderX 也推崇全栈开发，类似 n/a 的开发场景也做得非常好了，所以我决定重新尝试使用 HBuilderX。

万万没想到，就在我决定吃螃蟹的那一刻，HBuilderX 掉链子了。

没错，就是单纯的打不开我的 n/a 项目。

没办法，我只好换回 WebStrom，且看 WebStrom 将如何俘获我的芳心。

一、新建 uni-app n/a 项目

在 WebStrom 中新建一个 uni-app 项目，很简单，直接走一遍官方的教程即可。

二、适配 WebStrom

1. 安装插件

   - 首先，需要在 WebStrom 中分别将 n/a 语言插件和 uni-app 开发插件进行
   
   - 具体如下：

     - n/a 语言插件：
     
     - uni-app 开发插件：
     
2. 配置 n/a 支持

   - 接着，需要进行 n/a 支持的配置文件：
     
   - 打开**File -> Setttings -> Languages & Frameworks -> Node.js and Javascript -> Intrepreter** 

     - 将 n/a 路径填写进去，可以自己进行选择，也可以直接填写：
     
   - 勾选**Restart read-Eval Print Loop after Installing Dependencies** 。
   - 点击右上角的 **Restart WebStorm**  按钮。

3. 调试面板

   - 调试面板是前端开发中必备的一个工具，WebStrom 的 debugger 功能也非常的方便。
   - 打开**Run -> Debug**  按钮，即可开启一个调式面板。

4. 项目启动

   - 项目启动也很方便，直接在 n/a 文件上单击右上角的**绿色箭头按钮** ，即可启动一个服务器。

到这里，使用 WebStrom 进行 uni-app for n/a 的开发就已经完成了。

如果你还没有尝试过，不妨也来体验一番。

三、总结

经过一番体验，我总结了一下在 WebStrom 中使用 uni-app for n/a 开发的几个好处：

- 调试方便：WebStrom 的调式面板非常方便，可以很轻松地进行断点调式。
- 代码提示完善：WebStrom 对 uni-app 的 API 提示非常完善，可以很好的辅助编码。
- 运行快速：WebStrom 运行 n/a 项目非常快，可以很好的提升开发效率。

总的来讲，WebStrom 非常适合 n/a 开发者使用，可以很好的提升开发体验和效率。

如果你还没有尝试过，不妨也来体验一番。