fix: @jsxImportSource 模式不报错 (#1409)

.eslintrc.js

@@ -27,6 +27,7 @@ module.exports = {
     'no-case-declarations': 0,
     '@typescript-eslint/explicit-module-boundary-types': 0,
     '@typescript-eslint/no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
+    '@typescript-eslint/no-namespace': 0,
   },
   settings: {
     'import/parsers': {

jest.config.js

@@ -1,7 +1,7 @@
 module.exports = {
   runner: 'jest-electron/runner',
   testEnvironment: 'jest-electron/environment',
-  preset: 'ts-jest/presets/js-with-ts',
+  preset: 'ts-jest',
   collectCoverage: false,
   collectCoverageFrom: ['packages/*/src/**/*.{ts,tsx,js}', '!**/node_modules/**'],
   modulePathIgnorePatterns: ['packages/*/dist'],

packages/f2/jsx-dev-runtime.d.ts

@@ -0,0 +1 @@
+export * from './jsx-runtime';

packages/f2/jsx-dev-runtime.js

@@ -0,0 +1,2 @@
+'use strict';
+module.exports = require('./jsx-runtime');

packages/f2/jsx-runtime.d.ts

@@ -1 +1,2 @@
 export * from './es/jsx/jsx-runtime';
+export { JSX } from './es/jsx/jsx-namespace';

packages/f2/src/jsx/jsx-automatic.ts

@@ -1,8 +1,8 @@
-import JSX from './types';
+import { JSX as JSXNamespace } from './jsx-namespace';
 import { ElementType } from '../types';
 
 // 实现jsx-automatic 入口
-export function jsx(type: ElementType, config, key?: string): JSX.Element {
+export function jsx(type: ElementType, config, key?: string): JSXNamespace.Element {
   const { ref, ...props } = config || {};
   return {
     key,

packages/f2/src/jsx/jsx-classic.ts

@@ -0,0 +1,28 @@
+import { JSX as JSXNamespace } from './jsx-namespace';
+import { ElementType } from '../types';
+
+export namespace jsx {
+  export namespace JSX {
+    export type Element = JSXNamespace.Element;
+    export type ElementClass = JSXNamespace.ElementClass;
+    export type IntrinsicElements = JSXNamespace.IntrinsicElements;
+  }
+}
+
+// 实现jsx-classic 入口
+export function jsx(type: ElementType, config, ...children): JSXNamespace.Element {
+  const { key, ref, ...props } = config || {};
+
+  // 保持和automatic模式一致
+  if (children.length) {
+    props.children = children.length === 1 ? children[0] : children;
+  }
+  return {
+    key,
+    ref,
+    type,
+    props,
+    // 存储一些过程中的cache值
+    _cache: {},
+  };
+}

packages/f2/src/jsx/jsx-namespace.d.ts

@@ -0,0 +1,47 @@
+import {
+  Ref,
+  ElementType,
+  Props,
+  RectProps,
+  CircleProps,
+  LineProps,
+  PolygonProps,
+  PolylineProps,
+  ArcProps,
+  SectorProps,
+  TextProps,
+  CustomProps,
+  MarkerProps,
+  ImageProps,
+} from '../types';
+
+export namespace JSX {
+  export interface Element {
+    key: string;
+    ref?: Ref;
+    type: ElementType;
+    props: Props;
+    [key: string]: any;
+  }
+
+  export interface ElementClass {
+    refs: {};
+    props: Props;
+    render(): Element | null;
+  }
+
+  export interface IntrinsicElements {
+    group: RectProps;
+    rect: RectProps;
+    circle: CircleProps;
+    line: LineProps;
+    polygon: PolygonProps;
+    polyline: PolylineProps;
+    arc: ArcProps;
+    sector: SectorProps;
+    text: TextProps;
+    custom: CustomProps;
+    marker: MarkerProps;
+    image: ImageProps;
+  }
+}

packages/f2/src/jsx/jsx-runtime.ts

@@ -1,4 +1,4 @@
 import { jsx } from './jsx-automatic';
 import Fragment from './fragment';
 
-export { Fragment, jsx, jsx as jsxs };
+export { Fragment, jsx, jsx as jsxs, jsx as jsxDEV };

packages/f2/src/jsx/types.d.ts

@@ -1,50 +1,11 @@
-import {
-  Ref,
-  ElementType,
-  Props,
-  RectProps,
-  CircleProps,
-  LineProps,
-  PolygonProps,
-  PolylineProps,
-  ArcProps,
-  SectorProps,
-  TextProps,
-  CustomProps,
-  MarkerProps,
-  ImageProps,
-} from '../types';
+import { JSX as JSXNamespace } from './jsx-namespace';
 
+// 全局
 declare global {
   namespace JSX {
-    interface Element {
-      key: string;
-      ref?: Ref;
-      type: ElementType;
-      props: Props;
-      // children: Element;
-      _cache?: any;
-      [key: string]: any;
-    }
-    interface ElementClass {
-      refs: {};
-      props: Props;
-      render(): Element | null;
-    }
-    interface IntrinsicElements {
-      group: RectProps;
-      rect: RectProps;
-      circle: CircleProps;
-      line: LineProps;
-      polygon: PolygonProps;
-      polyline: PolylineProps;
-      arc: ArcProps;
-      sector: SectorProps;
-      text: TextProps;
-      custom: CustomProps;
-      marker: MarkerProps;
-      image: ImageProps;
-    }
+    export type Element = JSXNamespace.Element;
+    export type ElementClass = JSXNamespace.ElementClass;
+    export type IntrinsicElements = JSXNamespace.IntrinsicElements;
   }
 }
 

tsconfig.json

@@ -9,8 +9,7 @@
     "moduleResolution": "node",
     "useDefineForClassFields": false,
     "resolveJsonModule": true,
-    "skipLibCheck": true,
-    "allowJs": true
+    "skipLibCheck": true
   },
   "exclude": [
     "scripts",