导出默认数据语法错误:使用TypeScript在next.js上构建时意外导出令牌

2022-02-23 00:00:00 javascript typescript next.js babeljs
此处提供的代码=>; https://codesandbox.io/s/sweet-mcclintock-dhczx?file=/pages/index.js

尝试将@iconify-icons/cryptocurrency与next.js和TypeScript一起使用时出现初始错误(仅在TypeScript中发生)。

SyntaxError: Unexpected token export
    at Module._compile (internal/modules/cjs/loader.js:723:23)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Module.require (internal/modules/cjs/loader.js:692:17)
    at require (internal/modules/cjs/helpers.js:25:18)
    at eval (webpack-internal:///@iconify-icons/cryptocurrency/usdt:1:18)
    at Object.@iconify-icons/cryptocurrency/usdt (/sandbox/.next/server/pages/index.js:409:1)
    at __webpack_require__ (/sandbox/.next/server/pages/index.js:23:31)
    at eval (webpack-internal:///./pages/index.js:9:92)
    at Module../pages/index.js (/sandbox/.next/server/pages/index.js:398:1)
    at __webpack_require__ (/sandbox/.next/server/pages/index.js:23:31)
    at /sandbox/.next/server/pages/index.js:91:18
    at Object.<anonymous> (/sandbox/.next/server/pages/index.js:94:10)
    at Module._compile (internal/modules/cjs/loader.js:778:30)
/sandbox/node_modules/@iconify-icons/cryptocurrency/usdt.js:6
export default data;

并非所有库都会出现此问题。在我看来,在转写过程中,巴别塔的库语法有问题。

然后,我已尝试使用以下代码转换库next-transpile-module以解决该问题。

const withTM = require("next-transpile-modules")([
  "@iconify-icons/cryptocurrency"
]);

module.exports = withTM();

但是发生了一个新问题。

Error: next-transpile-modules - an unexpected error happened when trying to resolve "@iconify-icons/cryptocurrency"
Error: Can't resolve '@iconify-icons/cryptocurrency' in '/sandbox'
    at getPackageRootDirectory (/sandbox/node_modules/next-transpile-modules/src/next-transpile-modules.js:87:11)
    at Array.map (<anonymous>)
    at generateModulesPaths (/sandbox/node_modules/next-transpile-modules/src/next-transpile-modules.js:99:33)

总而言之,转换模块是我试图实现主要目标的方式。可能没有必要。


解决方案

导出@iconify-icons/cryptocurrency库的方式意味着您需要单独传输您使用的每个图标包。

const withTM = require("next-transpile-modules")([
  "@iconify-icons/cryptocurrency/usdt"
]);

module.exports = withTM();

相关文章