Angular创建服务器

本文创建web服务器语言环境：

TypeScript
WebStrom

创建web服务器详细步骤：

1、在根目录下初始化文件夹，命令：

npm init -y

2、应用node类型定义文件，作用为了让开发者可以在ts中使用已有的js库，命令

npm i @types/node --save

3、需要将ts编译成js，在根目录下新建配置文件，命名为：tsconfig.json

{
  "compilerOptions": {  //编译配置器
    "target":"es5",     //目标是编译成es5规范的脚本，也就是js
    "module": "commonjs", //模块的规范是commonjs
    "emitDecoratorMetadata":true,
    "experimentalDecorators":true,//这来给你个是要保存呢装饰器的源数据
    "outDir":"build",//编译后文件默认放在build文件夹下
    "lib":["es6"]//开发时使用es6的语法
  },
  "exclude": [
    "node_modules"
  ]
}

4、点击WebStorm菜单栏的File->Setting

在这里插入图片描述

5、在根目录下新建 server 文件夹，新建ts文件

import * as http from 'http'

const server = http.createServer((request, response) => {
    response.end("Hello Node!");
});
server.listen(8000);

6、此时，根目录会自动生成build文件夹，其中有编译好的Js文件
7、启动node服务器，命令

node build/js文件名

8、此时，访问路径：http://localhost:8000（在ts文件中设置服务器端口号为8000）
在这里插入图片描述
9、安装Express框架，此框架提供了web应用常用的的功能，命令：

npm install express --save

10、安装express类型定义文件，命令：

npm install @types/express --save

11、每当修改ts文件的内容时，都要重新启动node服务器，数据才能更新。安装nodemon工具，可以解决这一问题。当代码变动时，nodemon工具会自动加载代码，不用重新启动服务器。命令：

npm install -g nodemon

12、安装完nodemon工具，需要使用nodemon启动一次服务器，命令：

nodemon build/js文件名

13、试试修改代码，再刷新网页。

以上就是创建web服务器的详细步骤，感谢阅读。

猜你喜欢