Svelte / Routify错误“缺少全局变量名称”

如何解决Svelte / Routify错误“缺少全局变量名称”

当我在Routify项目中导入“ AmazonCognitoIdentity”时，出现“缺少全局变量名称”错误。

错误消息：

 bundles src/main.js ÔåÆ dist\build\bundle.js...
LiveReload enabled
(!) Unresolved dependencies
https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
/js/amazon-cognito-identity.min.js (imported by src\pages\_components\Login.svelte)
(!) Missing global variable name
Use output.globals to specify browser global variable names corresponding to external modules
/js/amazon-cognito-identity.min.js (guessing 'amazonCognitoIdentity_min_js')
created dist\build\bundle.js in 2.7s
bundles src/sw.js ÔåÆ dist\sw.js...
created dist\sw.js in 1.6s

以下是我的代码

import { AmazonCognitoIdentity } from "/js/amazon-cognito-identity.min.js";

const authenticationData = {
    Username: userName,Password: password,};
  const authenticationDetails = new AmazonCognitoIdentity.AuthenticationDetails(
    authenticationData
  );
  console.log(authenticationDetails);
  const poolData = {       
    UserPoolId: "xxxx”
    ClientId: "xxxxxxx",};
  const userPool = new AmazonCognitoIdentity.CognitoUserPool(poolData);
  const userData = {
    Username: userName,Pool: userPool,};
  console.log(userData);
  const cognitoUser = new AmazonCognitoIdentity.CognitoUser(userData);

  cognitoUser.authenticateUser(authenticationDetails,{
    onSuccess: function (result) {
      const accesstoken = result.getAccesstoken().getJwtToken();
      console.log(`on sucess: ${accesstoken}`);
    },onFailure: function (err) {
      console.log(`onfailure: ${err}`);
      console.log(err);
    },});

并且我已经在_index.html

中链接了以下文件

<script src="./js/amazon-cognito-identity.min.js"></script>
<script src="./js/amazon-cognito-auth.min.js"></script>
<script src="https://sdk.amazonaws.com/js/aws-sdk-2.7.16.min.js"></script>

在正常的HTML广告JavaScript文件中也能正常运行。

解决方法

我的猜测是，您需要更改导入语句以使其具有相对性：

import { AmazonCognitoIdentity } from "./js/amazon-cognito-identity.min.js";

我不知道这个文件在哪里，但你需要在位置的开头有 . 或 ..。

由于我不是专家，所以无法解释原因。

npm i amazon-cognito-identity-js

先运行此命令，然后将您的导入更新为此：

import { AmazonCognitoIdentity } from 'amazon-cognito-identity-js';

合并后引发流错误

npm i amazon-cognito-identity-js

import { AmazonCognitoIdentity } from 'amazon-cognito-identity-js';

错误：

（！）插件节点解析：在“ E：\ ec-website \ htx-pp-client \ node_modules \ buffer \ index.js”上，首选内置模块“ buffer”而不是本地替代方案，并传递“ preferBuiltins”： false”以禁用此行为，或“ preferBuiltins：true”以禁用此警告

（！）未解决的依赖项 https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency 缓冲区（由node_modules \ amazon-cognito-identity-js \ es \ AuthenticationHelper.js，node_modules \ amazon-cognito-identity-js \ es \ CognitoUser.js，node_modules \ amazon-cognito-identity-js \ es \ CognitoJwtToken导入。 js）

[！]错误：node_modules \ amazon-cognito-identity-js \ es \ index.js不导出“ AmazonCognitoIdentity”，而是由src \ pages_components \ Login.svelte导入

将这一行添加到rollup.config.js

rollup.external = ["AmazonCognitoIdentity","amazon-cognito-identity-js"];
    rollup.output = {
      file: "dist/build/bundle.js",format: "umd",interop: "esModule",globals: {
        "amazon-cognito-identity-js": "AmazonCognitoIdentity",},};

以上错误已消失。但是在运行时会引发新的错误

未捕获的TypeError：无法读取未定义的属性'AmazonCognitoIdentity'

我通过添加克服了这个错误

import polyfills from "rollup-plugin-node-polyfills";
...
plugins: [
    polyfills(),...

到我的 rollup.config.js

import AmazonCognitoIdentity from 'amazon-cognito-identity-js';

您的导入正确吗？