Angular2 从 NPM (Googleapis) 导入模块答案

【问题标题】：Angular2 importing module from NPM (Googleapis)Angular2 从 NPM (Googleapis) 导入模块
【发布时间】：2019-10-03 14:05:28
【问题描述】：

我正在构建一个使用 Webpack 进行构建过程的 Angular2 应用程序。我想在我的应用中创建一个 Google oauth 登录功能。所以我已经从 npm 安装了 googleapi 包。但是我在将这个包导入我的应用程序时遇到了一些问题。

我正在尝试import * from 'googleapi';，但这会使应用程序崩溃并显示消息：

Uncaught ReferenceError: require is not defined

这是我的 System.config：

System.config({
  map: {
    rxjs: 'node_modules/rxjs',
    googleapis: 'node_modules/googleapis'
  },
  meta: {
    googleapis: { format: 'commonjs' }
  },
  packages: {
    app: {
      format: 'register',
      defaultExtension: 'js'
    },
    rxjs: {
      defaultExtension: 'js'
    }
  }
});
System.import('app/contacts-app').then(null, console.error.bind(console));

如何在我的应用中包含这个包？

【问题讨论】：

您是否尝试设置包googleapis 而不是元？您是否将 apis 文件作为脚本包含在 html 中（您不应该）？

标签： javascript google-api npm angular

【解决方案1】：

我不确定这个库是否可以在浏览器中使用，因为它依赖于使用request 的google-auth-library 库。后者只能在 Node 应用程序中使用...

浏览器有一个request库的端口：https://www.npmjs.com/package/browser-request。

关于您的错误，也许您忘记在 HTML 文件中包含 SystemJS：

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>  <----

【讨论】：

【解决方案2】：

现在有一个 ng-gapi npm 包装器，用于 Angular 的 googleapis 功能。这可能支持您的要求：https://www.npmjs.com/package/ng-gapi

【讨论】：