refactor: support load tsx files

midwayjs · Feb 22, 2019 · ee7ab7c · ee7ab7c
1 parent a93b842
commit ee7ab7c
Show file tree

Hide file tree

Showing 12 changed files with 111 additions and 4 deletions.
diff --git a/packages/midway-core/src/container.ts b/packages/midway-core/src/container.ts
@@ -207,7 +207,7 @@ export class MidwayContainer extends Container implements IContainer {
     const loadDirs = [].concat(opts.loadDir || []);
 
     for (const dir of loadDirs) {
-      const fileResults = globby.sync(['**/**.ts', '**/**.js', '!**/**.d.ts'].concat(opts.pattern || []), {
+      const fileResults = globby.sync(['**/**.ts', '**/**.tsx', '**/**.js', '!**/**.d.ts'].concat(opts.pattern || []), {
         cwd: dir,
         ignore: [
           '**/node_modules/**',

diff --git a/packages/midway-web/package.json b/packages/midway-web/package.json
@@ -27,9 +27,13 @@
   ],
   "license": "MIT",
   "devDependencies": {
+    "@types/react": "^16.0.38",
+    "@types/react-dom": "^16.0.4",
     "midway-bin": "^1.3.0",
     "midway-mock": "^1.3.0",
-    "pedding": "^1.1.0"
+    "pedding": "^1.1.0",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0"
   },
   "dependencies": {
     "@eggjs/router": "^1.1.0",

diff --git a/packages/midway-web/src/loader/webLoader.ts b/packages/midway-web/src/loader/webLoader.ts
@@ -159,7 +159,7 @@ export class MidwayWebLoader extends MidwayLoader {
 
     let arr = [];
     names.forEach((name) => {
-      arr = arr.concat([name + '.ts', name + '.js']);
+      arr = arr.concat([name + '.ts', name + '.tsx', name + '.js']);
     });
     return arr.concat(['!**/**.d.ts']);
   }

diff --git a/packages/midway-web/test/enhance.test.ts b/packages/midway-web/test/enhance.test.ts
@@ -392,4 +392,24 @@ describe('/test/enhance.test.ts', () => {
         .expect('root_test', done);
     });
   });
+
+  describe('load tsx file', () => {
+    let app;
+    before(() => {
+      app = utils.app('enhance/base-app-controller-tsx', {
+        typescript: true
+      });
+      return app.ready();
+    });
+
+    after(() => app.close());
+
+    it('should load tsx controller', (done) => {
+      request(app.callback())
+        .get('/')
+        .expect(200)
+        .expect(/react/, done);
+    });
+
+  });
 });
diff --git a/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/package.json b/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/package.json
@@ -0,0 +1,3 @@
+{
+  "name": "ali-demo"
+}
diff --git a/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/app/controller/my.tsx b/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/app/controller/my.tsx
@@ -0,0 +1,29 @@
+import { provide } from 'injection';
+import { controller, get } from '../../../../../../../src/';
+import * as React from 'react';
+import * as ReactDOM from 'react-dom/server';
+import App from '../../shared/App';
+
+@provide()
+@controller('/')
+export class My {
+  @get('/')
+  async index(ctx) {
+    ctx.body = `
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="">
+    <meta name="author" content="">
+    <title>SSR Test</title>
+</head>
+<body>
+    <div id="app">${ReactDOM.renderToString(<App />)}</div>
+</body>
+</html>
+`;
+  }
+}
diff --git a/...ges/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/config/config.default.ts b/...ges/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/config/config.default.ts
@@ -0,0 +1,12 @@
+
+export const keys = 'key';
+
+export const hello = {
+  a: 1,
+  b: 2,
+  d: [1, 2, 3],
+};
+
+export const plugins = {
+  bucLogin: false,
+};
diff --git a/...es/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/config/config.unittest.ts b/...es/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/config/config.unittest.ts
@@ -0,0 +1,5 @@
+
+exports.hello = {
+  b: 4,
+  c: 3,
+};
diff --git a/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/shared/App.css b/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/shared/App.css
@@ -0,0 +1,9 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+h1 {
+  font-size: 2rem;
+}
diff --git a/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/shared/App.tsx b/packages/midway-web/test/fixtures/enhance/base-app-controller-tsx/src/shared/App.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import Header from './components/Header';
+// import './App.css';
+
+export default () => {
+  return (
+    <div>
+      <Header />
+      <h1>App</h1>
+    </div>
+  );
+};
diff --git a/...midway-web/test/fixtures/enhance/base-app-controller-tsx/src/shared/components/Header.tsx b/...midway-web/test/fixtures/enhance/base-app-controller-tsx/src/shared/components/Header.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+
+export default () => {
+  return (
+    <ul style={{display: 'flex'}}>
+      <li>Home</li>
+      <li style={{marginLeft: 'auto'}}>Menu1</li>
+      <li>Menu2</li>
+      <li>Menu3</li>
+    </ul>
+  );
+};
diff --git a/packages/midway-web/tsconfig.json b/packages/midway-web/tsconfig.json
@@ -11,7 +11,8 @@
     "declaration": true,
     "outDir": "dist",
     "lib": ["es2017", "dom"],
-    "sourceMap": true
+    "sourceMap": true,
+    "jsx": "react"
   },
   "exclude": [
     "dist",