Module parse failed: Unexpected token (2:12) in createAuthHTTPClient.ts

[zhanghx0905]

我在nextjs中使用 tushan 包时，遇到了模块解析错误。具体错误信息如下：

⨯ ./node_modules/tushan/client/api/auth/createAuthHTTPClient.ts
Module parse failed: Unexpected token (2:12)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| import { fetchJSON } from '../http';
> import type { Options } from '../http/request';
| import { defaultAuthStorageKey } from './const';
| 

Import trace for requested module:
./node_modules/tushan/client/api/auth/createAuthHTTPClient.ts
./node_modules/tushan/client/api/auth/index.ts
./node_modules/tushan/client/api/index.ts
./node_modules/tushan/client/index.ts
./node_modules/tushan/index.ts

Environment

• Node.js version: 18.20.5
• npm version: 10.8.2
• Next.js version: 14.2.13
• TypeScript version: 5.x
• tushan package version: 0.3.10

Configuration Files

tsconfig.json

{
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
  "exclude": ["node_modules"]
}

package.json

{
  "name": "portal",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@chakra-ui/icons": "^2.1.1",
    "@chakra-ui/react": "^2.8.2",
    "@emotion/react": "^11.13.3",
    "@emotion/styled": "^11.13.0",
    "@types/jsonwebtoken": "^9.0.7",
    "axios": "^1.7.7",
    "cookie": "^1.0.2",
    "framer-motion": "^11.5.6",
    "jsonwebtoken": "^9.0.2",
    "mammoth": "^1.8.0",
    "mongoose": "^8.8.3",
    "next": "14.2.13",
    "react": "^18",
    "react-dom": "^18",
    "react-hook-form": "^7.53.2",
    "tushan": "^0.3.10"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "@types/react-icons": "^3.0.0",
    "eslint": "^8",
    "eslint-config-next": "14.2.13",
    "eslint-plugin-simple-import-sort": "^12.1.1",
    "typescript": "^5"
  }
}

next.config.mjs

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  output: "standalone",
};

export default nextConfig;

最简复现方法，参见https://github.com/zhanghx0905/nextjs-tushan-demo

1. npx create-next-app@latest 创建一个nextjs项目
2. npm i tushan
3. 在主页创建一个tushan组件
4. npm run dev
5. 访问主页 http://localhost:3000

希望developer能帮助我解决这个问题。

[zhanghx0905]

It doesn't look like integrating tushan with nextjs would be a wise choice.

[moonrailgun]

ok, its looks nextjs not support source code import.

[moonrailgun]

if you found some way to resolve it. feel free to send a PR for it