vitesse vue3发布添加库

Question

我试图用vue 3和类型记录向vitesse添加一些依赖项。我用pnpm添加了几个库

pnpm add @aws-sdk/credential-providers
pnpm add @aws-sdk/client-dynamodb

现在，当我尝试和pnpm dev时，当我命中使用依赖项的代码调用组件的路由时，会得到以下错误。我不知道该如何进行(更多的基础设施人员，这是我第一次尝试打字稿)

pnpm dev

> @ dev /Users/me/code/github/me/app-frontend
> vite --port 3333 --open

Pre-bundling dependencies:
  vite-ssg
  nprogress
  pinia
  vue-i18n
  vue
  (...and 3 more)
(this will be run only when your dependencies or config have changed)

  vite v2.6.10 dev server running at:

  > Local: http://localhost:3333/
  > Network: use `--host` to expose

  ready in 789ms.

3:56:55 PM [vite] hmr update /src/pages/hi/[name].vue
3:56:55 PM [vite] new dependencies found: @aws-sdk/client-dynamodb, @aws-sdk/credential-providers, updating...
 > node_modules/.pnpm/@aws-sdk+credential-provider-imds@3.40.0/node_modules/@aws-sdk/credential-provider-imds/dist-es/remoteProvider/httpRequest.js:3:9: error: No matching export in "browser-external:buffer" for import "Buffer"
    3 │ import { Buffer } from "buffer";
      ╵          ~~~~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-imds@3.40.0/node_modules/@aws-sdk/credential-provider-imds/dist-es/remoteProvider/httpRequest.js:4:9: error: No matching export in "browser-external:http" for import "request"
    4 │ import { request } from "http";
      ╵          ~~~~~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-imds@3.40.0/node_modules/@aws-sdk/credential-provider-imds/dist-es/fromContainerMetadata.js:3:9: error: No matching export in "browser-external:url" for import "parse"
    3 │ import { parse } from "url";
      ╵          ~~~~~

 > node_modules/.pnpm/@aws-sdk+shared-ini-file-loader@3.37.0/node_modules/@aws-sdk/shared-ini-file-loader/dist-es/index.js:2:9: error: No matching export in "browser-external:fs" for import "readFile"
    2 │ import { readFile } from "fs";
      ╵          ~~~~~~~~

 > node_modules/.pnpm/@aws-sdk+shared-ini-file-loader@3.37.0/node_modules/@aws-sdk/shared-ini-file-loader/dist-es/index.js:3:9: error: No matching export in "browser-external:os" for import "homedir"
    3 │ import { homedir } from "os";
      ╵          ~~~~~~~

 > node_modules/.pnpm/@aws-sdk+shared-ini-file-loader@3.37.0/node_modules/@aws-sdk/shared-ini-file-loader/dist-es/index.js:4:9: error: No matching export in "browser-external:path" for import "join"
    4 │ import { join, sep } from "path";
      ╵          ~~~~

 > node_modules/.pnpm/@aws-sdk+shared-ini-file-loader@3.37.0/node_modules/@aws-sdk/shared-ini-file-loader/dist-es/index.js:4:15: error: No matching export in "browser-external:path" for import "sep"
    4 │ import { join, sep } from "path";
      ╵                ~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-sso@3.41.0/node_modules/@aws-sdk/credential-provider-sso/dist-es/index.js:6:9: error: No matching export in "browser-external:crypto" for import "createHash"
    6 │ import { createHash } from "crypto";
      ╵          ~~~~~~~~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-sso@3.41.0/node_modules/@aws-sdk/credential-provider-sso/dist-es/index.js:7:9: error: No matching export in "browser-external:fs" for import "readFileSync"
    7 │ import { readFileSync } from "fs";
      ╵          ~~~~~~~~~~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-sso@3.41.0/node_modules/@aws-sdk/credential-provider-sso/dist-es/index.js:8:9: error: No matching export in "browser-external:path" for import "join"
    8 │ import { join } from "path";
      ╵          ~~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-ini@3.41.0/node_modules/@aws-sdk/credential-provider-ini/dist-es/index.js:5:9: error: No matching export in "node_modules/.pnpm/@aws-sdk+credential-provider-web-identity@3.41.0/node_modules/@aws-sdk/credential-provider-web-identity/dist-es/index.js" for import "fromTokenFile"
    5 │ import { fromTokenFile } from "@aws-sdk/credential-provider-web-identity";
      ╵          ~~~~~~~~~~~~~

 > node_modules/.pnpm/@aws-sdk+credential-provider-process@3.40.0/node_modules/@aws-sdk/credential-provider-process/dist-es/index.js:4:9: error: No matching export in "browser-external:child_process" for import "exec"
    4 │ import { exec } from "child_process";
      ╵          ~~~~

 > node_modules/.pnpm/@aws-sdk+credential-providers@3.42.0/node_modules/@aws-sdk/credential-providers/dist-es/fromTokenFile.js:3:9: error: No matching export in "node_modules/.pnpm/@aws-sdk+credential-provider-web-identity@3.41.0/node_modules/@aws-sdk/credential-provider-web-identity/dist-es/index.js" for import "fromTokenFile"
    3 │ import { fromTokenFile as _fromTokenFile, } from "@aws-sdk/credential-provider-web-identity";
      ╵          ~~~~~~~~~~~~~

3:56:56 PM [vite] error while updating dependencies:
Error: Build failed with 13 errors:
node_modules/.pnpm/@aws-sdk+credential-provider-imds@3.40.0/node_modules/@aws-sdk/credential-provider-imds/dist-es/fromContainerMetadata.js:3:9: error: No matching export in "browser-external:url" for import "parse"
node_modules/.pnpm/@aws-sdk+credential-provider-imds@3.40.0/node_modules/@aws-sdk/credential-provider-imds/dist-es/remoteProvider/httpRequest.js:3:9: error: No matching export in "browser-external:buffer" for import "Buffer"
node_modules/.pnpm/@aws-sdk+credential-provider-imds@3.40.0/node_modules/@aws-sdk/credential-provider-imds/dist-es/remoteProvider/httpRequest.js:4:9: error: No matching export in "browser-external:http" for import "request"
node_modules/.pnpm/@aws-sdk+credential-provider-ini@3.41.0/node_modules/@aws-sdk/credential-provider-ini/dist-es/index.js:5:9: error: No matching export in "node_modules/.pnpm/@aws-sdk+credential-provider-web-identity@3.41.0/node_modules/@aws-sdk/credential-provider-web-identity/dist-es/index.js" for import "fromTokenFile"
node_modules/.pnpm/@aws-sdk+credential-provider-process@3.40.0/node_modules/@aws-sdk/credential-provider-process/dist-es/index.js:4:9: error: No matching export in "browser-external:child_process" for import "exec"
...
    at failureErrorWithLog (/Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:1493:15)
    at /Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:1151:28
    at runOnEndCallbacks (/Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:941:63)
    at buildResponseToResult (/Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:1149:7)
    at /Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:1258:14
    at /Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:629:9
    at handleIncomingPacket (/Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:726:9)
    at Socket.readFromStdout (/Users/me/code/github/me/app-frontend/node_modules/.pnpm/esbuild@0.13.3/node_modules/esbuild/lib/main.js:596:7)
    at Socket.emit (node:events:390:28)
    at addChunk (node:internal/streams/readable:324:12)

Answer 1

由于Vite不单独包装NodeJS库，因此不能在浏览器中使用缓冲区、fs和path等核心库。您可以找到修补程序(如https://github.com/feross/buffer或https://github.com/ionic-team/rollup-plugin-node-polyfills)来帮助处理这些案例。

在我的例子中，我的缓冲区只有一个问题，所以我只安装了npm i buffer -D的缓冲区。