New to typescript, try to follow the demo https://www.npmjs.com/package/cp-react-tree-table to use this control in my project, but get below information.
Try to search and seems it's related to module definition which confuse.
Hope someone can show me light.
import * as jQuery from 'jquery';
import TreeDataTable from 'cp-react-tree-table';
'TreeDataTable' is declared but its value is never read.ts(6133)
Could not find a declaration file for module 'cp-react-tree-table'. 'path/node_modules/cp-react-tree-table/dist/index.js' implicitly has an 'any' type.
Try npm install #types/cp-react-tree-table if it exists or add a new declaration (.d.ts) file containing declare module 'cp-react-tree-table';ts(7016)
Could not find a declaration file for module 'cp-react-tree-table'. path/node_modules/cp-react-tree-table/dist/index.js' implicitly has an 'any' type.
Try npm install #types/cp-react-tree-table if it exists or add a new declaration (.d.ts) file containing declare module 'cp-react-tree-table';ts(7016)
Could not find a declaration file for module 'cp-react-tree-table'
Create a new file like cp-react-tree-table.d.ts then add the following content to resolve the error quickly, but it's unsafe.
declare module "cp-react-tree-table" {
let TreeDataTable: any;
export default TreeDataTable;
}
Also, make sure typescript honoring our declaration file.
Your module doesn't have a type definition.
You should have install : #types/cp-react-tree-table but apparently it doesn't exist.
So you have to manualy create a file : "cp-react-tree-table.d.ts" containing the types.
You have examples of types definition here.
Related
I'm trying to use a type declaration file. When using triple slash reference like so:
/// <reference path="../declarations.d.ts" />
The app builds fine, but I get the above eslint error: "Do not use a triple slash reference for ../declarations.d.ts, use import style instead(https://typescript-eslint.io/rules/triple-slash-reference/)
If I do use an import:
import "../declarations.d.ts"
The build fails and the declarations file is being ignored.
I also tried to use tsconfig.json to add the file, but that also failed (I'm using NX environment, probably there's some bug with NX)
So only the reference syntax is working, but then I get that es-lint error. Does anyone know how to fix this?
My custom declaration file:
import '#types/my-react-package';
declare module '#types/my-react-package' {
export interface PackageProps {
showPreview?: boolean;
}
}
I'm new to TypeScript and likes to separate my type definition from my code so I created a *.d.ts file but the exported TS definition cannot be imported and use on other module file
Module not found: Can't resoulve *.d.ts in "/file/path"
would someone recommended a fix or explanation why this happen ?
The solution I found in my case is that if you import something from *.d.ts. If your file is name data.d.ts you can import it like this.
import { testA } from data.d
notice the data.d from which the name of the file that you want to import is data.d.ts
I am unable to import xml file in tsx file, but in jsx file i can able to access that xml file
You need to define a module for typescript to evaluate, otherwise it will try to look for something like toolbox.xml.ts.
Something along these lines in a file called XML.d.ts (for this placed in a folder #types in src):
declare module "*.xml" {
const doc: any; // Change this to an actual XML type
export default doc;
}
and add "typeRoots": ["src/#types", "node_modules/#types"] to your tsconfig.json (this makes typescript pick up the new typings file along with all installed types).
I have the same issue and am not sure how this works; I cannot even solve a simple txt file import issue. In my case, my target is esnext and ESM modules
I have created a react typescript project with CRA with the command yarn create react-app my-app --typescript
now I have a module foo installed that does not have any typing not by default, not in defentlytyped repository.
i.e. in a component, I have
import {bar} from 'foo';
which throws error Type error: Could not find a declaration file for module 'foo'. '/*/node_modules/foo/dist/entry.js' implicitly has an 'any' type.
I created foo.d.ts in types folder at the root of the project like
declare module 'foo'{ import * as React from 'react' }
just to have the foo as type any but still, get the same error. it seems that whatever compiler (webpack,other transpiler) does not find the declaration at types folder
how can I add custom type declaration to the project?
Here is a real use-case example.
I managed to integrate kendo-ui-core into CRA+Typescript.
The problem was that there are no typings for kendo-ui-core, namely the typings have a different name: #types/kendo-ui
Typescript was complaining about not having type definitions
To resolve the issue, create a file called kendo-ui-core.d.ts in your /src directory with the following contents:
// src/kendo-ui-core.d.ts
declare module 'kendo-ui-core' {
import * as KendoTypings from '#types/kendo-ui';
export = KendoTypings;
}
This works:
/* create src/CustomTypes.ts */
namespace MyCustomType {
export type foo = number;
}
export default MyCustomType;
use like this:
import MyCustomType from "src/CustomTypes";
const num: MyCustomType.foo = 123;
I installed a module via npm, and am trying to access it inside my typescript file.
npm install marker-animate-unobtrusive --save
import SlidingMarker = require('marker-animate-unobtrusive');
This results in
//Error TS2307: Cannot find module 'marker-animate-unobtrusive'
Search for this issue brings upchanging the compiler options, others mention creating a d.ts file for Type Script to recognize the module, but I never got a clear answer anywhere. I tried these methods, but with little success so far.
I am using Angular 2 and Ionic 2 for this, if that information helps.
Any help is appreciated!!
The problem is because the SlidingMarker npm module doesn't yet have a type definition.
1) Create generic definition in typings/marker-animate-unobtrusive.d.ts:
declare module 'marker-animate-unobtrusive' {
const x: any;
export = x;
}
2) Add this file to list of definitions in typings/main.d.ts (or typings/index.d.ts if you are using the newer typings):
/// <reference path="marker-animate-unobtrusive.d.ts"></reference>
3) Next, update your import statement:
import * as SlidingMarker from 'marker-animate-unobtrusive';
Volia! Note, you may need to change any variables cast as "SlidingMarker" to "any" to avoid other TypeScript errors.