如何在vscode中使用nodejs

如何在vscode中使用nodejs,第1张

一、使用Express创建项目[这两步都在dos 模式下执行]

1,安装全局的Express!(已安装请忽略)

npm install -g express

2,创建项目

创建项目(创建文件夹名称ExpressApp)

express ExpressApp

小插曲:如果你习惯了Linux下的环境,你可以在自己电脑上安装cmder(不知道是什么东西,请自行百度),这个命令行工具排版漂亮,不像微软的dos 那么枯燥!我用的是Mini版本,如果你想体验linux下的全部功能,可以下载full版本。

3,下载第三方包

(1)cmd命令行切换到项目目录

cd d:\nodejs\ExpressApp

(2)根据需要编辑package.json,运行如下指令安装第三方包

npm install

在项目目录下node_modules可见安装好的第三方包

ExpressApp

|– node_modules

(3)运行项目

npm start

输出如下:

ExpressApp@0.0.0 start d:\Nodejs_Workspace\ExpressApp

node ./bin/www

注:npm start指令会自动执行node ./bin/www

在浏览器中输入http://localhost:3000,可访问Express欢迎页面

二、使用VSCode开发Nodejs

1、VSCode打开Nodejs

code d:\nodejs\ExpressAppcode.

注:在当前项目下创建ExpressApp.bat,输入“code .”即可,下次直接此文件直接使用VSCode打开Nodejs项目

2、添加智能提示

VSCode打开Nodejs项目,默认是没有智能提示。

(1)使用TypeScript Definition Manager(TSD)在项目中下载所需的tsd文件,VSCode中打开时有智能

全局安装tsd(如已安装忽略)

npm install -g tsd

下载所需的组件提示(以下载node、express、requirejs提示为例)

tsd query node --action installtsd query express --action installtsd install require

注:

①多个提示组件在query参数后可以空格分隔简写为tsd query node express –action install

②组件会项目目录下添加typings文件夹

|– typings

|– node

|– express

|– require

(2)添加js文件引用的智能提示

假如在文件引用另外一个文件common.js时,文件头添加如下

{ // See https://go.microsoft.com/fwlink/?LinkId=759670 // for the documentation about the jsconfig.json format "compilerOptions": {"target": "es6","module": "commonjs","allowSyntheticDefaultImports": true }, "exclude": ["node_modules","bower_components","jspm_packages","tmp","temp" ]}

(小提示,如果你引入了rquire,那么你的编辑器右下方会显示一个“灯泡”的提示,你只要点灯泡就不用自己苦逼的写这个配置文件了)

此配置表示代码服从ES5标准并使用commonjs规范,发VScode下有此配置之后,可以实现在文件中对require引用js文件的智能提示。(我测试时无此配置也会有智能提示,不清楚什么原因)

简介

Node.js是一个帮助开发应用的JavaScript运行平台, 它快速且灵活

NPM是一个Node.js模块的包管理程序

VS Code 支持JavaScript 和TypeScript语言--以及 Node.js 及时调试, 要想运行一个Node.js应用, 你需要安装Node.js的运行时环境

*** 作系统: OS X 10.11.6

版本:

VS Code  1.4

node 6.2.2

code 1.4.0

tsc 1.8.10

npm 3.9.5

VS Code 提供了一个 code 命令,用来在 shell 环境下调用编辑器。使用快捷键 ⇧⌘P(或 F1) 唤起命令面板,输入以下命令即可完成安装。

mkdir Hello

cd Hello

code .

您可以直接从命令行打开文件或文件夹。这里 '.' 是指到当前文件夹,因此 VS Code将启动并打开当前文件夹。

代码提示

通过tsd或者typings这两个工具安装(两个工具的作者是同一个人,目前tsd已经废弃了)。

tsd 和 typings 用法:

tsd:

//全局安装

npm install tsd -g

typings:

//全局安装

npm install typings -g

如果你的电脑上没有安装TypeScript Compiler的话,是无法使用tsc这个指令的。要安装也很简单

npm install  typescript -g

node express、lodash等的自动补全

typings install dt~node --global

typings install dt~express --global

typings install dt~lodash --global

//vscode官方文档上express的typings使用的是

typings install dt~express dt~serve-static dt~express-serve-static-core --global

其中”dt~”为使用DefinitelyTyped类型定义的意思,vscode可以识别这种定义。

配置jsconfig.json

在使用typings之前,需要在vscode里面配置一下名为jsconfig.json的文件, VS Code通过这个文件找到自动补全文件。配置方法很简单,随便选中一个js文件,vscode右下角会d出一个绿色的小灯泡,如图所示:

创建package.json

package.json 文件就是定义了项目的各种元信息,包括项目的名称,git repo 的地址,作者等等。最重要的是,其中定义了我们项目的依赖,这样这个项目在部署时,我们就不必将 node_modules

目录也上传到服务器,服务器在拿到我们的项目时,只需要执行 npm install

,则 npm 会自动读取 package.json 中的依赖并安装在项目的 node_modules

下面,然后程序就可以在服务器上跑起来了。

npm init

如果只是测试项目或者练习用,没有仓库地址

只需在package.json里面做如下配置即可:

{

   ...

   "private": true,

   ...

}

以这种方式把项目声明为私有,这样npm就不会再提示配置repository及readme了

否则会遇到这个错误

npm WARN package.json xxx@0.0.0 No repository field.

npm WARN package.json xxx@0.0.0 No README data

需要配置仓库路径

{

   ...

   "repository": {

       "type": "git",

       "url": "http://github.com/yourname/repositoryname.git"

   },

   ...

}

配置完成后就可以随意安装模块了

npm install utility express lodash --save

--save 的作用,就是会在你安装依赖的同时,自动把这些依赖写入 package.json。命令执行完成之后,查看 package.json,会发现多了一个 dependencies

字段

运行

VS Code内置调试器支持调试Node.js运行时,同时也可以调试JavaScript、TypeScript以及其他JS转译语言。

点击

图标来到调试界面

单击调试视图顶部栏中的齿轮图标,并选择好调试环境,VS Code会在.vscode目录下为你生成一份launch.json。

来看launch.json

这里的program 设置的是启动文件, index.js

此时回到文件界面, 按 F5 就可以运行了

vscode不能安装node.js

一、安装步骤

下载对应你系统的Node.js版本:https://nodejs.org/en/download/

选安装目录进行安装(这里可以自定义安装位置)

环境变量配置以及测试

二、具体过程

1.下载软件,我下载的是.msi文件,需要安装,一直next就可以了,如果需要更改安装位置的话,可以自己更改;如果下载的是zip压缩包,只需要将其解压放置在你想要放置的文件夹中(一直下一步就行了)

2.安装完成之后,可以进行简单的测试 安装是否成功。在键盘按下【win+R】键,输入cmd,然后回车,打开cmd窗口。两个命令:node_v&npm_v(新版的Node.js已自带npm,安装Node.js时会一起安装,npm的作用就是对Node.js依赖的包进行管理,也可以理解为用来安装/卸载Node.js需要装的东西)


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11726932.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-18
下一篇2023-05-18

发表评论

登录后才能评论

评论列表(0条)

    保存