热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Node.js开发入门—notepad++forNode.js

对于Node.js开发,论IDE的话,Webstorm是不二的选择,但它是收费的(可免费使用30天)。一开始,我们先将就一下,使用notepad++来编写Node.js应用。这样做还有一大好处:

对于Node.js开发,论IDE的话,Webstorm是不二的选择,但它是收费的(可免费使用30天)。一开始,我们先将就一下,使用notepad++来编写Node.js应用。这样做还有一大好处:没有关于Node.js的代码高亮和自动补全,可以更好地敦促我们使用在线API文档记忆各种类库API。死磕自己吧,enjoy it。

notepad++的安装与配置

到“https://notepad-plus-plus.org/download/v6.8.2.html”这里下载吧,6.8.2版本,我选择的是zip包,解压即可。

从你解压的位置找到npp.6.8.2.bin这个文件,里面有notepad++.exe这个文件,直接执行即可。也可以发送个快捷方式到桌面,或者添加到任务栏上去。

npp有个插件管理器,可以这么打开(参考下图):

打开后效果类似下面:

Nodepad++新版本自带插件管理器,想装什么插件就装什么。安装过的可以点击“Installed”标签查看,有更新的就在“Updates”标签下,那默认打开的Available标签呢,下面就是你可以安装的列表了。

我们就先安装两个插件,一个是NppExec,一个是JSTool。

安装NppExec

如前面的插件图所示,我已经选中了NppExec这个插件,点击右下角的Install按钮就可以了。安装成功后,可能需要重启npp。重启后,npp的Plugins菜单里会多一个NppExec子菜单。

JSTool的安装过程类似,不说咧。

配置代码自动完成功能

npp虽然是个小巧的代码编辑器,也带了自动完成功能哦。可以通过“Settings–>Preferences”菜单来配置。参考下图:

在Notepad++里配置Nodejs

我们在使用Qt Creator或Visual Studio这种IDE时,按个F5什么的就能Run,非常方便。基于Node.js开发Web应用,我们也有这么个小小愿望,npp的NppExec可以满足我们。

使用Node.js开发,运行一个项目,有两种情况:

  1. 对于简单的js文件,可以执行“node xxx.js”
  2. 对于基于express的应用,可以执行“npm start”

不论哪种,都得跑到命令行(cmd窗口)下面去,效率确实不高。好在npp的插件NppExec可以配置一些命令并把这些命令保存到脚本里,添加到Macro菜单下作为单独的命令来执行,并且还可以配置快捷键。

严重参考了这篇英文文章:http://blog.aguskurniawan.net/post/notepadjs.aspx。特此感谢。

添加Run Nodejs

点击 Plugin->NppExec 菜单,做下列动作:

  • 取消 Console Command History 选项
  • 选中 Save all files on execute
  • 选中 Follow $(CURRENT_DIRECTORY)

然后你的 Plugin->NppExec 菜单看起来是这样子的:

然点击 Plugin->NppExec 里的 Execute 菜单,可以看到一个对话框,类似下面(如果你从来没保存过运行脚本,会先弹出一个选择文件的对话框,取消它):

在这个对话框里写入:

cd "$(CURRENT_DIRECTORY)"
node $(FILE_NAME)

然后点击 Save 按钮,保存为 RunNodejs :

好啦,接下来配置菜单和快捷键。

点击菜单 Plugins->NppExec->Advanced Options。选中 Place to the Macros submenu ,在 Associated script 下拉列表框里选择RunNodejs,在上面的Item name编辑框里输入“Run Nodejs”,再点击左下角的 Add/Modify 按钮。最终效果参考下图:

点击 OK 按钮关闭对话框。

最后,我们来给我们刚添加的 Run Nodejs 命令关联一个快捷键。点击 Settings->Shortcut Mapper… ,在弹出的Shortcut mapper对话框里选中Plugin commands这个按钮,切换到来自插件的命令,在列表中找到我们的Run Nodejs,鼠标左键双击(或者点击对话框底部的Modify按钮),在弹出的对话框里编辑快捷键:

我给 Run Nodejs 设置的快捷键是 CTRL+ALT+F5 。

现在你就可以在npp的 Macro 菜单下看到 Run Nodejs 了。

打开我们之前的 HelloWorld.js 文件,按下 CTRL+ALT+F5 ,效果如下:

如上图所示,npp会在软件界面底部打开一个Console视图,里面会显示执行“node HelloWorld.js”输出的结果。

添加 Run Npm

步骤和添加Run Nodejs都是一样的,唯一要注意的是,NppExec在执行脚本时,遇到cmd或bat命令,必须输全后缀(即cmd和bat不可省略)。参考下图:

我给Run Npm配置的快捷键是 CTRL+F5 。可能你更倾向于 F5 ,但 F5 已被 Run 命令占用,你实在想抢过来,就先取消那个。

在Notepad++中打开HelloExpress示例(参看Express安装与使用)的app.js,然后按下 CTRL+F5 就可以看到下面的效果:

好啦,现在我们的Notepad++可以用于Node.js开发了,不用来回在编辑器和命令行下切换,感觉好了一点点。


其它文章:

  • Node.js开发入门——使用对话框ngDialog
  • Node.js开发入门——引入UIBootstrap
  • Node.js开发入门——用MongoDB改造LoginDemo
  • Node.js开发入门——MongoDB与Mongoose
  • Node.js开发入门——使用COOKIE保持登录
  • Node.js开发入门——使用AngularJS内置服务
  • Node.js开发入门——Angular简单示例
  • Node.js开发入门——使用AngularJS
  • Node.js开发入门——使用jade模板引擎
  • Node.js开发入门——Express里的路由和中间件
  • Node.js开发入门——Express安装与使用
  • Node.js开发入门——HTTP文件服务器
  • Node.js开发入门——HelloWorld再分析
  • Node.js开发入门——环境搭建与HelloWorld

推荐阅读
  • 本文通过探讨React中Context的使用,解决了在多层级组件间传递状态的难题。我们将详细介绍Context的工作原理,并通过实际案例演示其在项目中的具体应用。 ... [详细]
  • 本文将介绍如何编写一些有趣的VBScript脚本,这些脚本可以在朋友之间进行无害的恶作剧。通过简单的代码示例,帮助您了解VBScript的基本语法和功能。 ... [详细]
  • 资源推荐 | TensorFlow官方中文教程助力英语非母语者学习
    来源:机器之心。本文详细介绍了TensorFlow官方提供的中文版教程和指南,帮助开发者更好地理解和应用这一强大的开源机器学习平台。 ... [详细]
  • 深入解析 Vue 的 Transition 组件与第三方动画库的结合使用
    本文详细介绍了 Vue 中的 Transition 组件,探讨其内置类名机制、触发时机及自定义类名的应用。同时,结合 animate.css 和 GSAP 等第三方库,展示了如何实现复杂的动画效果。 ... [详细]
  • 基于Node.js、Express、MongoDB和Socket.io的实时聊天应用开发
    本文详细介绍了使用Node.js、Express、MongoDB和Socket.io构建的实时聊天应用程序。涵盖项目结构、技术栈选择及关键依赖项的配置。 ... [详细]
  • 深入理解Vue.js:从入门到精通
    本文详细介绍了Vue.js的基础知识、安装方法、核心概念及实战案例,帮助开发者全面掌握这一流行的前端框架。 ... [详细]
  • 本文探讨了2019年前端技术的发展趋势,包括工具化、配置化和泛前端化等方面,并提供了详细的学习路线和职业规划建议。 ... [详细]
  • 深入解析ES6至ES8的新特性与应用
    本文详细介绍了自2015年发布的ECMAScript 6.0(简称ES6)以来,JavaScript语言的多项重要更新,旨在帮助开发者更好地理解和利用这些新特性进行复杂应用的开发。 ... [详细]
  • 前端开发中的代码注释实践与规范
    本文探讨了前端开发过程中代码注释的重要性,不仅有助于个人清晰地回顾自己的编程思路,还能促进团队成员之间的有效沟通。文章将详细介绍HTML、CSS及JavaScript中的注释使用方法,并提出一套实用的注释规范。 ... [详细]
  • 1.如何在运行状态查看源代码?查看函数的源代码,我们通常会使用IDE来完成。比如在PyCharm中,你可以Ctrl+鼠标点击进入函数的源代码。那如果没有IDE呢?当我们想使用一个函 ... [详细]
  • 实用正则表达式有哪些
    小编给大家分享一下实用正则表达式有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下 ... [详细]
  • 本文介绍了如何使用JavaScript的Fetch API与Express服务器进行交互,涵盖了GET、POST、PUT和DELETE请求的实现,并展示了如何处理JSON响应。 ... [详细]
  • 本文探讨了如何在 Pug 模板中正确地使用 JSON 插值,并解决了相关文档不足的问题。我们将介绍通过 gulp-pug 处理 JSON 数据的具体方法,以及如何在模板中插入和显示这些数据。 ... [详细]
  • NVIDIA Titan RTX深度评测
    NVIDIA的Titan RTX被誉为当前最强大的桌面显卡之一,其卓越的性能和高昂的价格吸引了众多专业人士和技术爱好者的关注。本文将详细介绍Titan RTX的技术规格、性能表现及应用场景。 ... [详细]
  • Microsoft即将发布WPF/E的CTP(Community Technology Preview)和SDK,标志着RIA(Rich Internet Application)技术的新里程碑。更多详情及下载链接请参见MSDN官方页面。 ... [详细]
author-avatar
手机用户2502868585
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有