Solution to: Cannot find module './manifest.json'. Consider using '--resolveJsonModule' to import module with '.json' extension

[4Furki4]

Hi folks,

I just tried CRXJS for the first time and love it!

I followed the docs to create my very first extension to get started. However, there was a type error in the vite.config.ts file.

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import { crx } from '@crxjs/vite-plugin'
// Cannot find module './manifest.json'. Consider using '--resolveJsonModule' to import module with '.json' extension.ts(2732)
import manifest from './manifest.json'

export default defineConfig({
  plugins: [
    react(),
    crx({ manifest }),
  ],
})

I checked the tsconfig.json file to set resolveJsonModule option to true but it was already set to true. There is another tsconfig file called tsconfig.node.json and I added these two options to it.

{
  ...
  "resolveJsonModule": true,
  "allowSyntheticDefaultImports": true,
  ...
}

The error was resolved and the server is running flawlessly. If you have the same type error, give it a try.

Please let me know if I made any mistake, thanks for all the contributors!