WebStorm 6.0下运行pomelo项目

本文详细介绍了如何在Windows和Linux环境下安装WebStorm6.0,并通过一系列步骤创建并运行Pomelo项目。包括安装所需JDK、初始化项目、配置WebStorm进行调试与运行。

1、安装WebStorm 6.0

(1)windows下就不用多说了,下载地址:http://www.jetbrains.com/webstorm/,下载一个安装程序一路next就OK,注意安装前先安装jdk

(2)在linux的话,安装前也需要安装JDK

 

[html]  view plain copy
  1. sudo apt-get install default-jdk  

 

然后将webstorm解压,运行bin/webstorm.sh,命令行:sh bin/webstorm.sh,至此webstorm安装完成。

2、创建pomelo_demo

创建一个pomelo这样的一个文件夹,然后在cmd下切换到这个目录下,输入:

 

[html]  view plain copy
  1. pomelo init mypomelo   

 

这时在pomelo目录下就会有一个mypomelo的工程目录,然后我们把cmd路径切换到mypomelo工程目录下,接着执行:

 

[html]  view plain copy
  1. npm-install.bat   

 

完毕,其实我们就可以在game-server下pomelo start,web-server下node app运行了,但这里咱们要用WebStorm。

3、WebStorm打开运行pomelo项目

运行WebStorm,打开

选中mypomelo目录

等项目加载完后,点击这,进入服务器配置页面

点击左上角+号,追加一个配置

选择Node.js

配置gameServer

同上再追加一个webServer

保存完毕后,在WebStorm主页面上选中gameServer,点击右边的绿三角,就可以开始调试运行

同理,选中webServer,点击右边的绿三角,就可以开始调试运行。

 

最后关于调试 Pomelo 应用程序,咱们还是看网易Pomelo官网的吧:

https://github.com/NetEase/pomelo/wiki/使用-WebStorm-IDE-调试-Pomelo-应用程序
### 导入并运行项目WebStorm #### 创建新的 Project SDK 为了在 WebStorm 中设置项目的软件开发套件(SDK),需点击位于 Project SDK 旁边的“new”按钮来建立一个新的插件 SDK[^2]。 #### 设置 JavaScript 环境 JavaScript 是一种主要在客户端执行的语言,负责网页的行为逻辑。确保 WebStormJavaScript 解释器配置正确以便支持 JS 功能的调试与运行[^1]。 #### 配置 ESLint 和 Vite 构建工具 对于基于 Vite 的 Vue3 TypeScript 项目,在项目根目录下应创建 `.eslintignore` 文件用于指定哪些文件夹或文件不需要被 ESLint 检查,比如 `dist`, `node_modules`, 或者 `public` 文件夹。此外,还需调整 Vite 的配置使得其可以在每次启动或是打包过程中自动触发 ESLint 来进行代码质量检测以及可能存在的错误修正工作[^3]。 #### 处理源映射文件 当涉及到样式表如 SCSS 的处理时,可以利用命令行参数控制生成何种类型的`.map`文件以帮助开发者更容易追踪编译后的资源到原始文件的位置关系。此过程可以通过四种方式完成:`auto`(默认), `file`, `inline`, 或者完全关闭(`none`)这种关联机制[^4]。 #### 完整环境搭建指南 针对更详细的步骤描述,例如怎样通过 Vite 建立一个包含 Vue3 及 TypeScript 支持的新工程,并进一步集成了 Element Plus UI 库、Vue Router 路由管理器、Vuex 数据存储解决方案还有 Axios HTTP 请求库等组件;同时也涵盖了 CSS 预处理器的选择和应用,以及遵循特定编码标准的要求等内容,则可参照专门的文章资料获取更多信息[^5]。 ```bash # 执行以下命令安装依赖项并启动本地服务器 npm install npm run dev ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值