Skip to content

Commit 498512b

Browse files
Daniel15Daniel15
committed
Documentation updates
1 parent 6dc862a commit 498512b

File tree

3 files changed

+111
-0
lines changed

3 files changed

+111
-0
lines changed

‎site/jekyll/guides/cassette.md

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
---
2+
layout: docs
3+
title: Cassette
4+
---
5+
6+
[Cassette](http://getcassette.net/) is an asset bundling library for ASP.NET.
7+
You can learn more on [its website at getcassette.net](http://getcassette.net/).
8+
ReactJS.NET supports the use of Cassette to compile JSX into JavaScript and
9+
minify it along with all your other JavaScript. To use Cassette with JSX,
10+
install the [React.Cassette](https://www.nuget.org/packages/Cassette.React/)
11+
NuGet package and modify your `CassetteConfiguration.cs` file to include `.jsx`
12+
files in your bundle.
13+
14+
```csharp
15+
bundles.Add<ScriptBundle>("main.js",
16+
// Add your JSX files here
17+
"~/Content/HelloWorld.react.jsx",
18+
"~/Content/AnythingElse.react.jsx",
19+
// You can include regular JavaScript files in the bundle too
20+
"~/Content/ajax.js"
21+
);
22+
```
23+
24+
This will add all three files into a `main.js` bundle that you can reference and
25+
render from your view using Cassette:
26+
27+
```html{2-3,13}
28+
@{
29+
Bundles.Reference("main.css");
30+
Bundles.Reference("main.js");
31+
}
32+
<!DOCTYPE html>
33+
<html>
34+
<head>
35+
@Bundles.RenderStylesheets()
36+
</head>
37+
<body>
38+
...
39+
<script src="http://fb.me/react-0.10.0.min.js"></script>
40+
@Bundles.RenderScripts()
41+
</body>
42+
```
43+
44+
See the [React.Samples.Cassette](https://github.com/reactjs/React.NET/tree/master/src/React.Sample.Cassette)
45+
project for an example.
46+
47+
Precompilation
48+
==============
49+
50+
**New in ReactJS.NET 0.2.0**
51+
52+
Cassette supports using an MSBuild task to minify and combine your assets before
53+
deployment. This makes the start time of your application a lot quicker, and is
54+
also required to use JSX files on Linux via Mono (as the JSX transformer does
55+
not currently support Mono).
56+
57+
Refer to the Cassette
58+
[compile-time bundle generation using MSBuild](http://getcassette.net/documentation/v2/msbuild)
59+
documentation for more information.

‎site/jekyll/guides/mono.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
layout: docs
3+
title: Linux (Mono)
4+
---
5+
6+
**New in ReactJS.NET 0.2.0**
7+
8+
ReactJS.NET 0.2.0 includes partial Mono support. Server-side component rendering
9+
is supported, but JSX compilation is not yet supported. In order to use JSX
10+
on Linux, you need to precompile all your JSX files on Windows before
11+
deployment. This can be done via the [MSBuild task](/guides/msbuild.html) or via
12+
[Cassette](/guides/cassette.html). Precompilation via the MSBuild task will
13+
create `.generated.js` files which need to be deployed alongside the original
14+
`.jsx` files.

‎site/jekyll/guides/msbuild.md

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
---
2+
layout: docs
3+
title: MSBuild
4+
---
5+
6+
**New in ReactJS.NET 0.2.0**
7+
8+
ReactJS.NET includes an MSBuild task for compiling JSX into JavaScript. This is
9+
handy to improve the start time of your application, especially if you have a
10+
large number of JSX files. Additionally, it is required for use on platforms
11+
where JSX compilation is not yet supported (such as Mono).
12+
13+
To use it, first reference the `TransformJsx` task, and then call it wherever
14+
you like:
15+
16+
```xml
17+
<UsingTask
18+
AssemblyFile="tools\React\React.MSBuild.dll"
19+
TaskName="TransformJsx"
20+
/>
21+
<Target Name="TransformJsx">
22+
<TransformJsx SourceDir="$(MSBuildProjectDirectory)" TargetDir="" />
23+
</Target>
24+
```
25+
26+
To get started easily, you can install the [React.MSBuild]
27+
(https://www.nuget.org/packages/React.MSBuild/) NuGet package which will
28+
automatically modify your web application's `.csproj` file to reference the task
29+
and run it after every site compilation. To customise the process (for example,
30+
to only compile the JSX files for release builds), modify the `TransformJsx`
31+
build target that was added to the csproj file.
32+
33+
The NuGet package is good for getting started quickly, but it has some
34+
limitations. The package needs to add a reference to `React.MSBuild.dll`, even
35+
though this assembly is only used at build time and not actually used at
36+
runtime. Instead of using the NuGet package, you can just manually copy all the
37+
assembly files into a folder (such as `tools\React`) and just reference the task
38+
manually.

0 commit comments

Comments
 (0)