dart-lang / dart-lang/webdev

[documentation] documentation on how to compile dart to js for a non-web target with webdev build

Open
#2,432 3 comments 3 reactions 1 assignee Claimed by @bkonyi View on GitHub
P3 package:webdev triaged type-documentation
Dominant language
Dart
Stars
224
Forks
94
Avg merge
7h 14m
Merged PRs (30d)
2

Description

I want to compile dart to js for a non-web target (eg. [fermyon/js][1], [node][6])

I'm told it's possible with 2 possible approaches:

1. [webdev build --no-release][2] suggested [here][3]
2. [dart compile js --server-mode][9] suggested [here][4] with a [3rd party node_preamble][5]

it would be nice to have some documentation on how to achieve this the `1.` approach.

I admit that this is a skill issue rather than a dart issue
but maybe I'm not the only developer facing this and a minimal example would be great

here is a reproducible setup/example using `node` ([repo][7])

node example

- set up node dependencies
```sh
npm init -y && \
npm install express && \
npm install --save-dev typescript @types/node @types/express ts-node-dev
```
- create the file `tsconfig.json` with the code below
```json
{
"compilerOptions": {
"allowJs": true,
"target": "ES6",
"module": "commonjs",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"outDir": "./dist",
"rootDir": "./src"
},
"include": ["src"]
}
```

- create the file `src/greeting.js with the following code
```js
export function greeting() {
return "Hello from JS"
}
```
- create the file `src/index.ts` with the code below
```ts
import express, { Request, Response } from 'express';
import { greeting } from './greeting.js';

const app = express();
const port = 3000;

app.get('/', (req: Request, res: Response) => {
res.send(greeting());
});

app.listen(port, () => {
console.log(`Server is running on http://localhost:${port}`);
});
```

how can I create an equivalent

```dart
String greeting() => 'Hello from Dart';
```
import it and use it in `index.ts`?

#

### notes

- packages from [node_interop][8]'s family seem to me that are "replacing" node rather than actually "interop"
- [stack overflow question](https://stackoverflow.com/questions/78459268/how-do-i-compile-dart-to-js-for-a-non-web-target)

#

cc
@maks & @sigmundch from https://github.com/dart-lang/sdk/issues/53884
@nex3 I've been told on Twitter that you have experience with this use case from `sass`

[1]: https://developer.fermyon.com/wasm-languages/javascript
[2]: https://github.com/dart-lang/sdk/tree/main/pkg/dev_compiler
[3]: https://github.com/dart-lang/sdk/issues/53884#issuecomment-2103495085
[4]: https://github.com/dart-lang/sdk/issues/53884#issuecomment-2104813609
[5]: https://github.com/mbullington/node_preamble.dart
[6]: https://nodejs.org/en
[7]: https://github.com/iapicca/dart_node_example
[8]: https://pub.dev/packages/node_interop
[9]: https://dart.dev/tools/dart-compile#js

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.