在Webstorm中创建nodejs项目框架Express

这里介绍两种方法,一种是利用Webstorm自带的创建功能创建,另一种是利用node自带的npm命令行。
下面先来介绍第一种方法,利用Webstorm自带的创建功能创建Express
第一步:
这里写图片描述
第二步:
这里写图片描述
注意:
⑴首先要安装有Node.js才行
⑵其次Template那里选择Ejs模板
第三步:点击右下角的Create,即完成创建。
以下是目录结构:
这里写图片描述
这里有必要提示以下:这种方法创建的Express框架,它的一些API都会被Webstorm所支持,如上图右边的require方法和express包。

接下来是第二种方法,利用Nodejs自带的npm来创建Express框架。
第一步:首先进入到需要创建框架的目录。比如我的是
这里写图片描述
之后在该目录空白位置按住Shift键+鼠标右键调出Powershell窗口,这样就不用再进入这个位置了。如下:
这里写图片描述
第二步:输入命令行 express -e 项目名称,如我的项目名称是示例2。
这里写图片描述
执行这条命令之后就会在该目录下自动创建“示例2”项目文件夹,
这里写图片描述
这里要注意的是我的Nodejs和Express的版本,可能其他版本命令行会有所不同。
这里写图片描述
第三步:进入示例2文件夹并执行npm install命令。如下:这里写图片描述
这个npm install命令的作用是把示例2文件夹中package.json所定义的一些依赖给下载下来。这样就完成了九成的创建工作了。
接下来我用Webstorm来打开这个项目。如下:这里写图片描述
对比第一种方法创建的项目目录结构,
这里写图片描述
你会发现第二种方法创建的Express项目,Webstorm提示无法识别方法require()。要解决这个问题也很简单,打开配置文件,文件->设置->语言和框架->Node.js和NPM,点击enable后确定即可。
这里写图片描述
再来看一下js文件,发现已经可以识别require方法了
这里写图片描述

但是!!!!
无论哪种方法,创建的项目的缩进都是两个空格,对于习惯了4个缩进空格的我来说,真的有点蛋疼。只能先设置webstorm的缩进后再手动调了,还好文件不多(除去node_modules)

猜你喜欢

转载自blog.csdn.net/wd1024719195/article/details/79914030