typescript 编译报错 Cannot find module

Question

编译报错 Cannot find module 'config'

相关代码

index.tsx （import 引入config模块（改成 js文件正常，tsx文件报红色））

import React, { useState, useContext } from 'react'
import config from 'config'

next.config.js

const path = require('path')
const webpack = require('webpack')
const css = require('@zeit/next-css')

const node_config_env = process.env.ENV || 'development'

module.exports = css({
  webpack(config) {
    config.resolve.alias = {
      ...(config.resolve.alias || {}),
      'styled-components': path.resolve('node_modules', 'styled-components'),
      config: path.resolve(__dirname, `config/env.${node_config_env}.js`),
    }

    return config
  }
})

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "experimentalDecorators": true,
    "baseUrl": ".",
    "paths": {
      "config": ["./config/*"]
    },
  },
  "exclude": [
    ".next",
    "node_modules"
  ],
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ]
}

config文件夹

打包编译时报 Cannot find module 'config'

错误信息：

Answer 1

import config from "yourPathToConfig/config"

假设你的index和config目录/文件平级
应该写成

import config from "./config"

直接写成import config from "config"的的意思等于告诉编译器 去给我找找当前目录或者父（包含爷，以此类推）级目录下的node_modules目录下有没有一个叫config的

Answer 2

我今天在弄的时候也遇到了同样的问题 然后自己找了一通发现是 tsconfig 里面这个的事
这样写 ts 会认为你要去 config 文件夹下找文件

"compilerOptions": {
    "paths": {
      "config": ["./config/*"]
    },
  },

import config from 'config' 这样引入的时候他认为你没有文件路径自然找不到文件

你需要自己将他的路径补全在里面

"compilerOptions": {
    "paths": {
      "config": ["./config/development"]
    },
  },