Skip to content

Commit c3db27e

Browse files
jsturtevantjsturtevant
committed
Update docs to use latest componentize-dotnet
Signed-off-by: James Sturtevant <jstur@microsoft.com>
1 parent 7fa0d98 commit c3db27e

1 file changed

Lines changed: 28 additions & 87 deletions

File tree

  • component-model/src/language-support

‎component-model/src/language-support/csharp.md‎

Lines changed: 28 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -13,56 +13,19 @@ componentize-dotnet serves as a one-stop shop for .NET developers, wrapping seve
1313
- [wit-bindgen](https://github.com/bytecodealliance/wit-bindgen) (WIT imports and exports)
1414
- [wasm-tools](https://github.com/bytecodealliance/wasm-tools) (component conversion)
1515
- [WASI SDK](https://github.com/WebAssembly/wasi-sdk) (SDK used by NativeAOT-LLVM)
16+
- [Wac](https://github.com/bytecodealliance/wac) (used to compose components)
1617

17-
First, install the .NET SDK. For this walkthrough, we’ll use the [.NET 9 SDK RC
18-
1](https://dotnet.microsoft.com/en-us/download/dotnet/9.0). You should also have
19-
[wasmtime](https://wasmtime.dev/) installed so you can run the binary that you produce.
18+
First, install the .NET SDK. For this walkthrough, we’ll use the [.NET 10 SDK preview](https://dotnet.microsoft.com/en-us/download/dotnet/10.0).
19+
You should also have [wasmtime](https://wasmtime.dev/) installed so you can run the binary that you produce.
2020

2121
Once you have the .NET SDK installed, create a new project:
2222

2323
```sh
24-
dotnet new classlib -o adder
24+
dotnet new install BytecodeAlliance.Componentize.DotNet.Templates
25+
dotnet new componentize.wasi.cli -o adder
2526
cd adder
2627
```
2728

28-
The `componentize-dotnet` package depends on the `NativeAOT-LLVM` package, which resides at the
29-
dotnet-experimental package source, so you will need to make sure that NuGet is configured to refer
30-
to experimental packages. You can create a project-scoped NuGet configuration by running:
31-
32-
```sh
33-
dotnet new nugetconfig
34-
```
35-
36-
Edit your nuget.config file to look like this:
37-
38-
```xml
39-
<?xml version="1.0" encoding="utf-8"?>
40-
<configuration>
41-
<packageSources>
42-
<!--To inherit the global NuGet package sources remove the <clear/> line below -->
43-
<clear />
44-
<add key="dotnet-experimental" value="https://pkgs.dev.azure.com/dnceng/public/_packaging/dotnet-experimental/nuget/v3/index.json" />
45-
<add key="nuget" value="https://api.nuget.org/v3/index.json" />
46-
</packageSources>
47-
</configuration>
48-
```
49-
50-
Now back in the console we’ll add the `BytecodeAlliance.Componentize.DotNet.Wasm.SDK` package:
51-
52-
```sh
53-
dotnet add package BytecodeAlliance.Componentize.DotNet.Wasm.SDK --prerelease
54-
```
55-
56-
In the .csproj project file, add the following to the `<PropertyGroup>`:
57-
58-
```xml
59-
<RuntimeIdentifier>wasi-wasm</RuntimeIdentifier>
60-
<UseAppHost>false</UseAppHost>
61-
<PublishTrimmed>true</PublishTrimmed>
62-
<InvariantGlobalization>true</InvariantGlobalization>
63-
<SelfContained>true</SelfContained>
64-
```
65-
6629
Next, create or download the WIT world you would like to target. For this example we will use an
6730
[`example`
6831
world](https://github.com/bytecodealliance/component-docs/tree/main/component-model/examples/example-host/add.wit)
@@ -107,7 +70,7 @@ If we build it:
10770
dotnet build
10871
```
10972

110-
The component will be available at `bin/Debug/net9.0/wasi-wasm/native/adder.wasm`.
73+
The component will be available at `bin/Debug/net10.0/wasi-wasm/native/adder.wasm`.
11174

11275
## Building a component that exports an interface
11376

@@ -157,12 +120,12 @@ Once again, compile an application to a Wasm component using `dotnet build`:
157120
$ dotnet build
158121
Restore complete (0.4s)
159122
You are using a preview version of .NET. See: https://aka.ms/dotnet-support-policy
160-
adder succeeded (1.1s) → bin/Debug/net9.0/wasi-wasm/adder.dll
123+
adder succeeded (1.1s) → bin/Debug/net10.0/wasi-wasm/adder.dll
161124

162125
Build succeeded in 2.5s
163126
```
164127

165-
The component will be available at `bin/Debug/net9.0/wasi-wasm/native/adder.wasm`.
128+
The component will be available at `bin/Debug/net10.0/wasi-wasm/native/adder.wasm`.
166129

167130
## Building a component that imports an interface
168131

@@ -172,51 +135,13 @@ our `adder` component and call the `add` function. We will later compose this co
172135
the `adder` library component we just built.
173136

174137
Now we will be taking the `adder` component and executing it from another WebAssembly component.
175-
`dotnet new console` creates a new project that creates an executable.
138+
`dotnet new componentize.wasi.cli` creates a new project that creates an executable.
176139

177140
```sh
178-
dotnet new console -o host-app
141+
dotnet new componentize.wasi.cli -o host-app
179142
cd host-app
180143
```
181144

182-
The `componentize-dotnet` package depends on the `NativeAOT-LLVM` package, which resides at the
183-
dotnet-experimental package source, so you will need to make sure that NuGet is configured to refer
184-
to experimental packages. You can create a project-scoped NuGet configuration by running:
185-
186-
```sh
187-
dotnet new nugetconfig
188-
```
189-
190-
Edit your nuget.config file to look like this:
191-
192-
```xml
193-
<?xml version="1.0" encoding="utf-8"?>
194-
<configuration>
195-
<packageSources>
196-
<!--To inherit the global NuGet package sources remove the <clear/> line below -->
197-
<clear />
198-
<add key="dotnet-experimental" value="https://pkgs.dev.azure.com/dnceng/public/_packaging/dotnet-experimental/nuget/v3/index.json" />
199-
<add key="nuget" value="https://api.nuget.org/v3/index.json" />
200-
</packageSources>
201-
</configuration>
202-
```
203-
204-
Now back in the console we’ll add the `BytecodeAlliance.Componentize.DotNet.Wasm.SDK` package:
205-
206-
```sh
207-
dotnet add package BytecodeAlliance.Componentize.DotNet.Wasm.SDK --prerelease
208-
```
209-
210-
In the .csproj project file, add the following to the `<PropertyGroup>`:
211-
212-
```xml
213-
<RuntimeIdentifier>wasi-wasm</RuntimeIdentifier>
214-
<UseAppHost>false</UseAppHost>
215-
<PublishTrimmed>true</PublishTrimmed>
216-
<InvariantGlobalization>true</InvariantGlobalization>
217-
<SelfContained>true</SelfContained>
218-
```
219-
220145
Copy the same WIT file as before into your project:
221146

222147
```wit
@@ -236,7 +161,7 @@ world hostapp {
236161
}
237162
```
238163

239-
Add it to your .csproj project file as a new `ItemGroup`:
164+
Add it to your `host-app.csproj` project file as a new `ItemGroup`:
240165

241166
```xml
242167
<ItemGroup>
@@ -282,9 +207,25 @@ world, it needs to be composed the first component. You can compose your `host-a
282207
your `adder` component by running [`wac plug`](https://github.com/bytecodealliance/wac):
283208

284209
```sh
285-
wac plug bin/Debug/net9.0/wasi-wasm/native/host-app.wasm --plug ../adder/bin/Debug/net9.0/wasi-wasm/native/adder.wasm -o main.wasm
210+
wac plug bin/Debug/net10.0/wasi-wasm/native/host-app.wasm --plug ../adder/bin/Debug/net10.0/wasi-wasm/native/adder.wasm -o main.wasm
286211
```
287212

213+
You can also automate the process by adding the following to your `host-app.csproj`:
214+
215+
```xml
216+
<Target Name="ComposeWasmComponent" AfterTargets="Publish">
217+
<PropertyGroup>
218+
<EntrypointComponent>bin/$(Configuration)/$(TargetFramework)/wasi-wasm/native/host-app.wasm</EntrypointComponent>
219+
<DependencyComponent>../example/bin/$(Configuration)/$(TargetFramework)/wasi-wasm/native/adder.wasm</DependencyComponent>
220+
</PropertyGroup>
221+
222+
<MakeDir Directories="dist" />
223+
<Exec Command="$(WacExe) plug $(EntrypointComponent) --plug $(DependencyComponent)" -o dist/main.wasm />
224+
</Target>
225+
```
226+
227+
Run `dotnet build` again you will have a composed component in `./dist/main.wasm`
228+
288229
Then you can run the composed component:
289230

290231
```sh

0 commit comments

Comments
 (0)