Use NPM packages in your projects with the power of sound Dart.
This package reads and translates TypeScript declaration files (.d.ts) to Dart through interop and enables importing the JS file without having to include it in your HTML file.
It is also possible to generate interop from files without using NPM, one example is Deno.
The list of available packages is in the end of this README.
Sponsorship, donations
Please, if you find this package useful, consider sponsoring or donating:
Examples
Simple console.log
import 'package:typings/core.dart' as js;
void main() {
js.console.log(['Hello', 'World']);
}
Using the GoJS library
import 'package:typings/d/gojs.dart' as go;
void main() {
// inserts the GoJS js file into the DOM
await go.import();
// from here you can use the go library, ie:
final goDiagram = go.Diagram.$2(diagram)
..addDiagramListener(go.DiagramEventNameOptions.linkDrawn, showLinkLabel)
..addDiagramListener(
go.DiagramEventNameOptions.linkRelinked, showLinkLabel);
}
Adding packages
It is very simple to add libraries from NPM to be available through this package.
- Create a file in
typings/lib/d/PACKAGE.dart
- Add an export to
yourpackage/yourpackage.dart
- Add an annotation to the export that will guide the package on how to sync from NPM or any other kind of source.
Example:
File /typings/d/gojs.dart
import 'package:typings/annotations.dart';
@Typings.npm(
package: 'gojs', // package name
version: '2.3.5', // the version that should be fetched from NPM
dirName: 'gojs', // the dir name to be created
contextCheck: 'go', // optionally the namespace to be checked in the JS when the JS file is imported
uses: [
'core' // the GoJS uses the core (DOM) types
]
)
export 'gojs/gojs.dart';
With this info the builder will automatically fetch the package from NPM, parse the package.json
and from there generate the import file and the interop bindings.
Refer to the wiki for guidance and few rules to add packages.
Currently available packages
Libraries
- annotations
- core
- TypeScript DOM & core bindings
- d/animejs
- Example:
- d/animejs/animejs
- d/child_process
- d/core
- d/deno
- d/deno/deno
- d/gojs
- GoJS official website: https://gojs.net/latest/index.html
- d/gojs/gojs
- d/inputmask
- Example:
- d/inputmask/inputmask
- d/typescript/typescript
- d/vscode
- Example:
- d/vscode/vscode
- d/webworker
- d/webworker/typescript
- d/ws
- tool/build
- typings