Angular2 CLI express server.ts 中的意外令牌导入

Posted 2023-03-08

【中文标题】Angular2 CLI express server.ts 中的意外令牌导入

【英文标题】：Unexpected token import in Angular2 CLI express server.ts

【发布时间】：2017-06-04 19:30:36

【问题描述】：

我正在启动一个 Angular2 应用程序，我正在使用 express 和 Angular CLI 1.0.0-beta.25.5 设置我的服务器

在这种文件结构中：

project root
|-server
  |-server.ts
|-src
  |-app

当我运行nodemon server.ts

我收到以下错误：

imports 在我的app 的其他地方工作，所以我不确定问题是什么。我也没有收到任何 vs 代码错误来表明任何东西都被错误地导入了。 express 和 body-parser 也被 npm install --saveed 以及 @types/express (--save-dev)。 是什么导致此导入声明表单无法正常工作，我该如何解决问题？

server.ts

import * as express from 'express';
import Application from 'express';
import apiFoods from './api/apiFoods';

const bodyParser = require('body-parser');
const app: Application = express();
app.use(bodyParser.json());

apiFoods(app);

app.listen(8090, () => 
    console.log('Server is now running on port 8090 ...');
); 

【问题讨论】：

如果你尝试导入 express = require('express');

【参考方案1】：

要么将节点更新到 7.x 以获得原生 es6 支持，要么像这样将 babel-node 与 nodemon 一起使用；

nodemon -w --exec "babel-node server.ts"

您还可以通过在 -w 之后添加文件夹名称来指定要监视哪些文件夹的更改，例如 -w server

要让 babel-node 工作，你必须安装 babel-preset-es2015

npm install --save-dev babel-preset-es2015

并在你的 package.json 文件旁边创建一个名为 .babelrc 的文件，内容如下

  "presets": ["es2015"]

【讨论】：

你能帮我澄清一下吗：为什么我必须在已经安装 typescript 的情况下使用 babel？我不明白根本问题。我模仿的例子没有.babelrc

这是回购github.com/angular-university/ngrx-course/blob/master/…

.babelrc 是 babel 在编译代码时使用的选项。您还可以在包文件上添加选项。在babeljs.io/docs/usage/babelrc 阅读更多内容。请注意，如果您使用 node v.7，则不需要转译代码，因此 repo 中代码的作者可能拥有最新版本的 node。这可能是它在没有他的选项的情况下工作的原因，但不是你

【参考方案2】：

这里的根本问题是 import 语句是一个节点无法识别的 ES6 命令。我找到的解决方案是使用ts-node先转译我的打字稿然后运行它。

npm install --save-dev ts-node

然后添加一个新脚本以在您的 package.json 中使用它

package.json

"scripts":
  "api-server": "./node_modules/.bin/ts-node ./server/server.ts"

当你想执行运行时：

npm run api-server

要使用nodemon 观看，我执行 (taken from this answer)：

nodemon --watch 'src/**/*.ts' --ignore 'src/**/*.spec.ts' --exec './node_modules/.bin/ts-node' server/server.ts

【讨论】：

通常server文件夹放在src下app旁边