Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot find json module import #25

Open
Coteh opened this issue Apr 25, 2019 · 0 comments
Open

Cannot find json module import #25

Coteh opened this issue Apr 25, 2019 · 0 comments

Comments

@Coteh
Copy link

Coteh commented Apr 25, 2019

I am currently running into an issue where vuetype refuses to generate a typing definition file for one of my Vue files due to json module imports that the TypeScript compiler could not find. However, these json modules do actually exist in the location specified in the import as far as I know.

I was not able to reproduce this issue with ts-node, which is another module I have in my project that uses the TypeScript compiler under the hood, so I am not sure whether this is an issue with vuetype or with my TypeScript configuration. Let me know if you think this is actually an issue with my TypeScript configuration rather than with vuetype and I'll take this question to StackOverflow (and close this ticket).

My setup:

I have a site/ subdirectory where I have an index.ts file (the entry point of my webpack build) that includes App Vue object from App.vue file in the same subdirectory. App.vue includes several components from site/components (which work as expected) as well as two JSON files from site/assets/data like this:

import * as movies from "./assets/data/movies.json";
import * as importedOrderings from "./assets/data/orderings.json";

What am I expecting:

vuetype emits App.vue.d.ts without error

What do I actually get?:

Emit Failed: C:\Users\Coteh\Documents\my-vue-project\site\App.vue.d.ts
  Error: [18,25] Cannot find module './assets/data/movies.json'.
  Error: [19,36] Cannot find module './assets/data/orderings.json'.

What I have tried:

  • I have created a typings.d.ts file with the following general declaration inside:
declare module "*.json" {
    const value: any;
    export default value;
}

I have placed this on both the root directory and the subdirectory where my TypeScript and Vue files are located (site/).

  • I have also tried enabling the new features in TypeScript 2.9 to allow for json modules to be default imports in my tsconfig.json (which I read is also apparently a way to get TypeScript to recognize json imports but I can be wrong about this)
"compilerOptions": {
        "resolveJsonModule": true,
        "esModuleInterop": true
    },

Neither of these options worked for me either (but it still does allow me to specify the json imports as default imports).

I don't know what may be happening here, and if it's possible that I could be pointed in the right direction I'd really appreciate it!

My current tsconfig.json

{
    "compilerOptions": {
        "outDir": "./public/",
        "sourceMap": true,
        "noImplicitAny": true,
        "module": "commonjs",
        "target": "es6",
        "downlevelIteration": true,
        "rootDirs": ["site"],
        "resolveJsonModule": true
    },
    "exclude": [
        "node_modules"
    ]
}

If there's any other information you need regarding my project setup, let me know.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant