diff --git a/cli/file_fetcher.rs b/cli/file_fetcher.rs
index 9c0ef920c523cc..128bba2ef06c36 100644
--- a/cli/file_fetcher.rs
+++ b/cli/file_fetcher.rs
@@ -481,7 +481,9 @@ fn map_file_extension(path: &Path) -> msg::MediaType {
None => msg::MediaType::Unknown,
Some(os_str) => match os_str.to_str() {
Some("ts") => msg::MediaType::TypeScript,
+ Some("tsx") => msg::MediaType::TSX,
Some("js") => msg::MediaType::JavaScript,
+ Some("jsx") => msg::MediaType::JSX,
Some("mjs") => msg::MediaType::JavaScript,
Some("json") => msg::MediaType::Json,
_ => msg::MediaType::Unknown,
@@ -1342,6 +1344,10 @@ mod tests {
map_file_extension(Path::new("foo/bar.ts")),
msg::MediaType::TypeScript
);
+ assert_eq!(
+ map_file_extension(Path::new("foo/bar.tsx")),
+ msg::MediaType::TSX
+ );
assert_eq!(
map_file_extension(Path::new("foo/bar.d.ts")),
msg::MediaType::TypeScript
@@ -1350,6 +1356,10 @@ mod tests {
map_file_extension(Path::new("foo/bar.js")),
msg::MediaType::JavaScript
);
+ assert_eq!(
+ map_file_extension(Path::new("foo/bar.jsx")),
+ msg::MediaType::JSX
+ );
assert_eq!(
map_file_extension(Path::new("foo/bar.json")),
msg::MediaType::Json
@@ -1371,6 +1381,10 @@ mod tests {
map_content_type(Path::new("foo/bar.ts"), None),
msg::MediaType::TypeScript
);
+ assert_eq!(
+ map_content_type(Path::new("foo/bar.tsx"), None),
+ msg::MediaType::TSX
+ );
assert_eq!(
map_content_type(Path::new("foo/bar.d.ts"), None),
msg::MediaType::TypeScript
@@ -1379,6 +1393,10 @@ mod tests {
map_content_type(Path::new("foo/bar.js"), None),
msg::MediaType::JavaScript
);
+ assert_eq!(
+ map_content_type(Path::new("foo/bar.jsx"), None),
+ msg::MediaType::JSX
+ );
assert_eq!(
map_content_type(Path::new("foo/bar.json"), None),
msg::MediaType::Json
diff --git a/cli/msg.rs b/cli/msg.rs
index 4416c7d71b67f2..20ab9db130408c 100644
--- a/cli/msg.rs
+++ b/cli/msg.rs
@@ -66,15 +66,19 @@ pub enum ErrorKind {
#[derive(Clone, Copy, PartialEq, Debug)]
pub enum MediaType {
JavaScript = 0,
- TypeScript = 1,
- Json = 2,
- Unknown = 3,
+ JSX = 1,
+ TypeScript = 2,
+ TSX = 3,
+ Json = 4,
+ Unknown = 5,
}
pub fn enum_name_media_type(mt: MediaType) -> &'static str {
match mt {
MediaType::JavaScript => "JavaScript",
+ MediaType::JSX => "JSX",
MediaType::TypeScript => "TypeScript",
+ MediaType::TSX => "TSX",
MediaType::Json => "Json",
MediaType::Unknown => "Unknown",
}
diff --git a/cli/state.rs b/cli/state.rs
index d7c6102048f4b0..ef870bef046c85 100644
--- a/cli/state.rs
+++ b/cli/state.rs
@@ -250,7 +250,9 @@ impl ThreadSafeState {
msg::MediaType::Json => {
state_.json_compiler.compile_async(state_.clone(), &out)
}
- msg::MediaType::TypeScript => {
+ msg::MediaType::TypeScript
+ | msg::MediaType::TSX
+ | msg::MediaType::JSX => {
state_.ts_compiler.compile_async(state_.clone(), &out)
}
msg::MediaType::JavaScript => {
diff --git a/cli/tests/046_jsx_test.tsx b/cli/tests/046_jsx_test.tsx
new file mode 100644
index 00000000000000..4e9380eb8f6df5
--- /dev/null
+++ b/cli/tests/046_jsx_test.tsx
@@ -0,0 +1,9 @@
+const React = {
+ createElement(factory: any, props: any, ...children: any[]) {
+ return {factory, props, children}
+ }
+}
+const View = () => (
+ land
+)
+console.log()
diff --git a/cli/tests/046_jsx_test.tsx.out b/cli/tests/046_jsx_test.tsx.out
new file mode 100644
index 00000000000000..85cfe824b15b21
--- /dev/null
+++ b/cli/tests/046_jsx_test.tsx.out
@@ -0,0 +1 @@
+{ factory: [Function: View], props: null, children: [] }
diff --git a/cli/tests/047_jsx_test.jsx b/cli/tests/047_jsx_test.jsx
new file mode 100644
index 00000000000000..553c4c5a5de824
--- /dev/null
+++ b/cli/tests/047_jsx_test.jsx
@@ -0,0 +1,9 @@
+const React = {
+ createElement(factory, props, ...children) {
+ return {factory, props, children}
+ }
+}
+const View = () => (
+ land
+)
+console.log()
diff --git a/cli/tests/047_jsx_test.jsx.out b/cli/tests/047_jsx_test.jsx.out
new file mode 100644
index 00000000000000..85cfe824b15b21
--- /dev/null
+++ b/cli/tests/047_jsx_test.jsx.out
@@ -0,0 +1 @@
+{ factory: [Function: View], props: null, children: [] }
diff --git a/cli/tests/integration_tests.rs b/cli/tests/integration_tests.rs
index 0e040718033496..930ad9477c0ac1 100644
--- a/cli/tests/integration_tests.rs
+++ b/cli/tests/integration_tests.rs
@@ -322,6 +322,16 @@ itest!(_045_proxy {
output: "045_proxy_test.ts.out",
});
+itest!(_046_tsx {
+ args: "run --reload 046_jsx_test.tsx",
+ output: "046_jsx_test.tsx.out",
+});
+
+itest!(_047_jsx {
+ args: "run --reload 047_jsx_test.jsx",
+ output: "047_jsx_test.jsx.out",
+});
+
itest!(async_error {
exit_code: 1,
args: "run --reload async_error.ts",
diff --git a/js/compiler.ts b/js/compiler.ts
index 56804ef9fb520a..77d88dd8b362c1 100644
--- a/js/compiler.ts
+++ b/js/compiler.ts
@@ -24,9 +24,11 @@ import { writeFileSync } from "./write_file.ts";
// Update carefully!
enum MediaType {
JavaScript = 0,
- TypeScript = 1,
- Json = 2,
- Unknown = 3
+ JSX = 1,
+ TypeScript = 2,
+ TSX = 3,
+ Json = 4,
+ Unknown = 5
}
// Startup boilerplate. This is necessary because the compiler has its own
@@ -198,8 +200,12 @@ function getExtension(fileName: string, mediaType: MediaType): ts.Extension {
switch (mediaType) {
case MediaType.JavaScript:
return ts.Extension.Js;
+ case MediaType.JSX:
+ return ts.Extension.Jsx;
case MediaType.TypeScript:
return fileName.endsWith(".d.ts") ? ts.Extension.Dts : ts.Extension.Ts;
+ case MediaType.TSX:
+ return ts.Extension.Tsx;
case MediaType.Json:
return ts.Extension.Json;
case MediaType.Unknown:
@@ -221,7 +227,8 @@ class Host implements ts.CompilerHost {
resolveJsonModule: true,
sourceMap: true,
stripComments: true,
- target: ts.ScriptTarget.ESNext
+ target: ts.ScriptTarget.ESNext,
+ jsx: ts.JsxEmit.React
};
private _sourceFileCache: Record = {};
@@ -511,7 +518,6 @@ window.compilerMain = function compilerMain(): void {
window.onmessage = ({ data }: { data: CompilerReq }): void => {
const { rootNames, configPath, config, bundle } = data;
const host = new Host(bundle);
-
let emitSkipped = true;
let diagnostics: ts.Diagnostic[] | undefined;
diff --git a/tsconfig.json b/tsconfig.json
index f62cf4c6d024c9..cf252cfd797664 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -17,6 +17,7 @@
"sourceMap": true,
"strict": true,
"target": "esnext",
+ "jsx": "react",
"types": []
},
"files": [