();
10 |
11 | return new Transform({
12 | // transform() is called with each chunk of data
13 | // tslint:disable-next-line:variable-name
14 | transform(chunk, _, _callback) {
15 | const marks = getUsedMarks(stream);
16 | const newMarks: string[] = [];
17 |
18 | marks.forEach((mark) => {
19 | if (!usedMarks.has(mark)) {
20 | newMarks.push(mark);
21 | usedMarks.add(mark);
22 | }
23 | });
24 |
25 | const chunkData = Buffer.from(chunk, 'utf-8');
26 |
27 | _callback(undefined, callback(newMarks) + chunkData);
28 | },
29 | });
30 | };
31 |
--------------------------------------------------------------------------------
/src/types.ts:
--------------------------------------------------------------------------------
1 | import { ComponentType, ForwardRefExoticComponent, ReactElement, ReactNode, Ref } from 'react';
2 |
3 | export interface DefaultImportedComponent {
4 | default: ComponentType
;
5 | }
6 |
7 | export type AnyFunction = (x: any) => any;
8 |
9 | export interface Default {
10 | default: T;
11 | }
12 |
13 | export interface Stream {
14 | marks: Record;
15 | }
16 |
17 | export type Mark = string[];
18 |
19 | export type Promised = () => Promise;
20 |
21 | export type DefaultComponent = ComponentType
| DefaultImportedComponent
;
22 | export type DefaultComponentImport = () => Promise>;
23 |
24 | export type Defaultable = P | Default
;
25 | /**
26 | * standard "importer" accepted by the package.
27 | * Could be {default:T} or T
28 | */
29 | export type DefaultImport = () => Promise>;
30 |
31 | export interface MarkMeta {
32 | loadable: Loadable;
33 | mark: Mark;
34 | chunkName: string;
35 | fileName: string;
36 | }
37 |
38 | export type LazyImport = () => Promise>;
39 |
40 | export interface LoadableComponentState {
41 | loading?: boolean;
42 | error?: any;
43 | }
44 |
45 | export interface Loadable {
46 | done: boolean;
47 | error: any;
48 | payload: T | undefined;
49 |
50 | mark: Mark;
51 |
52 | resolution: Promise;
53 | importer: any;
54 |
55 | isLoading(): boolean;
56 |
57 | reset(): void;
58 | replaceImportFunction(newImportFunction: Promised): void;
59 |
60 | loadIfNeeded(): Promise;
61 |
62 | tryResolveSync(then: (x: T) => Y): Promise;
63 |
64 | load(): Promise;
65 | reload(): Promise;
66 |
67 | then(callback: (x: T) => void, err: () => void): Promise;
68 | }
69 |
70 | export interface ComponentOptions {
71 | loadable: DefaultComponentImport | Loadable>;
72 |
73 | LoadingComponent?: ComponentType;
74 | ErrorComponent?: ComponentType;
75 |
76 | onError?: (a: any) => void;
77 |
78 | async?: boolean;
79 |
80 | render?: (Component: ComponentType | undefined, State: LoadableComponentState, props?: K) => ReactElement | null;
81 |
82 | forwardRef?: Ref;
83 | forwardProps?: K;
84 | }
85 |
86 | export interface HOCOptions {
87 | noAutoImport?: boolean;
88 | }
89 |
90 | export interface AdditionalHOC {
91 | done: Promise;
92 | preload(): Promise;
93 | }
94 |
95 | export type HOCType = ForwardRefExoticComponent> }> &
96 | AdditionalHOC;
97 |
98 | export interface ImportModuleHOCProps {
99 | fallback: NonNullable | null;
100 | }
101 |
102 | export interface ImportModuleProps extends ImportModuleHOCProps {
103 | children: (arg: T) => ReactElement | null;
104 | }
105 |
106 | export interface FullImportModuleProps extends ImportModuleProps {
107 | import: DefaultImport | Loadable;
108 | }
109 |
110 | export type ModuleFC = (props: ImportModuleProps) => ReactElement | null;
111 |
112 | export type HOCModuleType = ModuleFC & AdditionalHOC;
113 |
114 | export type HOC = (
115 | loader: DefaultComponentImport,
116 | options?: Partial> & HOCOptions
117 | ) => HOCType;
118 |
119 | export interface ImportedComponents {
120 | [index: number]: () => Promise>;
121 | }
122 |
--------------------------------------------------------------------------------
/src/ui/Component.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import { ReactElement } from 'react';
3 |
4 | import { settings } from '../configuration/config';
5 | import { ComponentOptions } from '../types';
6 | import { useImported } from './useImported';
7 |
8 | /**
9 | * @deprecated use {@link useImported} instead
10 | */
11 | function ImportedComponent(props: ComponentOptions): ReactElement | null {
12 | const { loading, error, loadable, imported: Component, retry } = useImported(props.loadable);
13 |
14 | if (loading && props.async) {
15 | throw loadable.resolution;
16 | }
17 |
18 | if ('render' in props && props.render) {
19 | return props.render(Component, { loading, error }, props.forwardProps);
20 | }
21 |
22 | if (Component) {
23 | // importedUUID for cache busting
24 | // @ts-ignore
25 | return ;
26 | }
27 |
28 | if (loading) {
29 | if (props.async) {
30 | throw loadable.resolution;
31 | }
32 |
33 | return props.LoadingComponent ? : null;
34 | }
35 |
36 | if (error) {
37 | // always report errors
38 | // tslint:disable-next-line:no-console
39 | console.error('react-imported-component', error);
40 |
41 | // let's rethrow the error after react leaves this function
42 | // this might be very crucial for the "safe" dev mode
43 | if (settings.rethrowErrors) {
44 | setTimeout(() => {
45 | throw error;
46 | });
47 | }
48 |
49 | if (props.ErrorComponent) {
50 | return ;
51 | }
52 |
53 | throw error;
54 | }
55 |
56 | return null;
57 | }
58 |
59 | export { ImportedComponent };
60 |
--------------------------------------------------------------------------------
/src/ui/HOC.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 | import { useMemo } from 'react';
3 |
4 | import { getLoadable } from '../loadable/loadable';
5 | import { ComponentOptions, DefaultComponentImport, HOCOptions, HOCType, LazyImport } from '../types';
6 | import { isBackend } from '../utils/detectBackend';
7 | import { asDefault } from '../utils/utils';
8 | import { ImportedComponent } from './Component';
9 | import { useLoadable } from './useImported';
10 |
11 | /**
12 | * creates a "lazy" component, like `React.lazy`
13 | * @see {@link useImported} or {@link useLazy}
14 | * @param {Function} loaderFunction - () => import('a'), or () => require('b')
15 | * @param {Object} [options]
16 | * @param {React.Component} [options.LoadingComponent]
17 | * @param {React.Component} [options.ErrorComponent]
18 | * @param {Function} [options.onError] - error handler. Will consume the real error.
19 | * @param {Function} [options.async = false] - enable React 16+ suspense.
20 | *
21 | * @example
22 | * const PageA = imported('./pageA', { async: true });
23 | */
24 | function loader(
25 | loaderFunction: DefaultComponentImport,
26 | baseOptions: Partial> & HOCOptions = {}
27 | ): HOCType {
28 | let loadable = getLoadable(loaderFunction);
29 |
30 | const Imported = React.forwardRef(function ImportedComponentHOC({ importedProps = {}, ...props }, ref) {
31 | const options = { ...baseOptions, ...importedProps };
32 | // re-get loadable in order to have fresh reference
33 | loadable = getLoadable(loaderFunction);
34 |
35 | return (
36 |
46 | );
47 | }) as HOCType;
48 |
49 | Imported.preload = () => {
50 | loadable.load().catch(() => ({}));
51 |
52 | return loadable.resolution;
53 | };
54 |
55 | Object.defineProperty(Imported, 'done', {
56 | get() {
57 | return loadable.resolution;
58 | },
59 | });
60 |
61 | return Imported;
62 | }
63 |
64 | const ReactLazy = React.lazy;
65 |
66 | /**
67 | * React.lazy "as-is" replacement
68 | */
69 | export function lazy(importer: LazyImport): React.FC {
70 | if (isBackend) {
71 | return loader(importer);
72 | }
73 |
74 | if (process.env.NODE_ENV !== 'production') {
75 | // lazy is not hot-reloadable
76 | if ((module as any).hot) {
77 | return loader(importer, { async: true });
78 | }
79 | }
80 |
81 | const topLoadable = getLoadable(importer);
82 |
83 | return function ImportedLazy(props: T) {
84 | const { loadable } = useLoadable(topLoadable);
85 |
86 | const Lazy = useMemo(() => ReactLazy(() => loadable.tryResolveSync(asDefault as any) as any), [loadable]);
87 |
88 | return ;
89 | };
90 | }
91 |
92 | export default loader;
93 |
--------------------------------------------------------------------------------
/src/ui/ImportedController.tsx:
--------------------------------------------------------------------------------
1 | import React, { createContext, useEffect, useState } from 'react';
2 |
3 | interface ImportedState {
4 | usesHydration: boolean;
5 | pastHydration: boolean;
6 | }
7 |
8 | export const importedState = createContext(undefined);
9 |
10 | export const HydrationState: React.FC<{ state: ImportedState }> = ({ state, children }) => (
11 | {children}
12 | );
13 |
14 | /**
15 | * @see [LazyBoundary]{@link LazyBoundary} - HydrationController is required for LazyBoundary to properly work with React>16.10
16 | * Established a control over LazyBoundary suppressing fallback during the initial hydration
17 | * @param props
18 | * @param [props.usesHydration=true] determines of Application is rendered using hydrate
19 | */
20 | export const ImportedController: React.FC<{
21 | /**
22 | * determines of Application is rendered using hydrate
23 | */
24 | usesHydration?: boolean;
25 | }> = ({ children, usesHydration = true }) => {
26 | const [state, setState] = useState({
27 | usesHydration,
28 | pastHydration: false,
29 | });
30 |
31 | useEffect(() => {
32 | setState((oldState) => ({ ...oldState, pastHydration: true }));
33 | }, []);
34 |
35 | return {children};
36 | };
37 |
--------------------------------------------------------------------------------
/src/ui/LazyBoundary.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 |
3 | import { isBackend } from '../utils/detectBackend';
4 | import { useIsClientPhase } from '../utils/useClientPhase';
5 |
6 | const LazyServerBoundary: React.FC<{
7 | fallback: NonNullable | null;
8 | }> = ({ children }) => {children};
9 |
10 | const LazyClientBoundary: React.FC<{
11 | fallback: NonNullable | null;
12 | }> = ({ children, fallback }) => (
13 |
18 | {children}
19 |
20 | );
21 |
22 | /**
23 | * React.Suspense "as-is" replacement. Automatically "removed" during SSR and "patched" to work accordingly on the clientside
24 | *
25 | * @see {@link HydrationController} has to wrap entire application in order to provide required information
26 | */
27 | export const LazyBoundary = isBackend ? LazyServerBoundary : LazyClientBoundary;
28 |
--------------------------------------------------------------------------------
/src/ui/Module.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 |
3 | import { getLoadable } from '../loadable/loadable';
4 | import { DefaultImport, FullImportModuleProps, HOCModuleType, ImportModuleProps } from '../types';
5 | import { useImported } from './useImported';
6 |
7 | /**
8 | * @deprecated use {@link useImported} instead
9 | */
10 | export function ImportedModule(props: FullImportModuleProps): React.ReactElement | null {
11 | const { error, loadable, imported: module } = useImported(props.import);
12 |
13 | if (error) {
14 | throw error;
15 | }
16 |
17 | if (module) {
18 | return props.children(module);
19 | }
20 |
21 | if (!props.fallback) {
22 | throw loadable.resolution;
23 | }
24 |
25 | return props.fallback as any;
26 | }
27 |
28 | /**
29 | * @deprecated use {@link useImported} instead
30 | */
31 | export function importedModule(loaderFunction: DefaultImport): HOCModuleType {
32 | const loadable = getLoadable(loaderFunction);
33 |
34 | const Module = ((props: ImportModuleProps) => (
35 |
36 | )) as HOCModuleType;
37 |
38 | Module.preload = () => {
39 | loadable.load().catch(() => ({}));
40 |
41 | return loadable.resolution;
42 | };
43 |
44 | Module.done = loadable.resolution;
45 |
46 | return Module;
47 | }
48 |
--------------------------------------------------------------------------------
/src/ui/context.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react';
2 |
3 | import { defaultStream } from '../loadable/stream';
4 | import { Stream } from '../types';
5 |
6 | export const streamContext = React.createContext(defaultStream);
7 |
8 | /**
9 | * SSR. Tracker for used marks
10 | */
11 | export const ImportedStream: React.FC<{
12 | stream: Stream;
13 | }> = ({ stream, children, ...props }) => {
14 | if (process.env.NODE_ENV !== 'development') {
15 | if ('takeUID' in props) {
16 | throw new Error('react-imported-component: `takeUID` was replaced by `stream`.');
17 | }
18 | }
19 |
20 | return {children};
21 | };
22 |
23 | export const UIDConsumer = streamContext.Consumer;
24 |
--------------------------------------------------------------------------------
/src/ui/useImported.ts:
--------------------------------------------------------------------------------
1 | import { ComponentType, lazy, LazyExoticComponent, useCallback, useContext, useEffect, useMemo, useState } from 'react';
2 |
3 | import { getLoadable } from '../loadable/loadable';
4 | import { consumeMark } from '../loadable/marks';
5 | import { isItReady } from '../loadable/pending';
6 | import { InnerLoadable } from '../loadable/toLoadable';
7 | import { DefaultComponentImport, DefaultImport, DefaultImportedComponent, Loadable } from '../types';
8 | import { isBackend } from '../utils/detectBackend';
9 | import { es6import } from '../utils/utils';
10 | import { streamContext } from './context';
11 |
12 | function loadLoadable(loadable: Loadable, callback: (l: any) => void) {
13 | const upd = () => callback({});
14 |
15 | loadable.loadIfNeeded().then(upd, upd);
16 | }
17 |
18 | function updateLoadable(loadable: Loadable, callback: (l: any) => void) {
19 | // support HMR
20 | if (process.env.NODE_ENV === 'development') {
21 | const upd = () => callback({});
22 |
23 | (loadable as InnerLoadable)._probeChanges().then((changed) => changed && upd(), upd);
24 | }
25 | }
26 |
27 | interface ImportedShape {
28 | imported?: T;
29 | error?: any;
30 | loading?: boolean;
31 |
32 | loadable: Loadable;
33 |
34 | retry(): void;
35 | }
36 |
37 | interface HookOptions {
38 | import?: boolean;
39 | track?: boolean;
40 | }
41 |
42 | /**
43 | * react hook to wrap `import` with a tracker
44 | * used by {@link useImported}
45 | * @internal
46 | */
47 | export function useLoadable(loadable: Loadable, options: HookOptions = {}) {
48 | const UID = useContext(streamContext);
49 |
50 | const wasDone = loadable.done;
51 |
52 | const [, forceUpdate] = useState({});
53 |
54 | useMemo(() => {
55 | if (options.import !== false) {
56 | if (options.track !== false) {
57 | consumeMark(UID, loadable.mark);
58 | }
59 |
60 | if (!wasDone) {
61 | loadLoadable(loadable, forceUpdate);
62 | } else {
63 | updateLoadable(loadable, forceUpdate);
64 | }
65 | }
66 |
67 | return true;
68 | }, [loadable, options.import, options.track]);
69 |
70 | if (isBackend && !isItReady() && loadable.isLoading()) {
71 | /* tslint:disable:next-line no-console */
72 | console.error(
73 | 'react-imported-component: trying to render a component which is not ready. You should `await whenComponentsReady()`?'
74 | );
75 | }
76 |
77 | // use mark
78 | // retry
79 | const retry = useCallback(() => {
80 | if (!loadable) {
81 | return;
82 | }
83 |
84 | loadable.reset();
85 | forceUpdate({});
86 | updateLoadable(loadable, forceUpdate);
87 | }, [loadable]);
88 |
89 | if (process.env.NODE_ENV !== 'production') {
90 | if (isBackend) {
91 | if (!loadable.done) {
92 | /* tslint:disable:next-line no-console */
93 | console.error(
94 | 'react-imported-component: using not resolved loadable. You should `await whenComponentsReady()`.'
95 | );
96 | }
97 | }
98 | }
99 |
100 | return useMemo(
101 | () => ({
102 | loadable,
103 | retry,
104 | update: forceUpdate,
105 | }),
106 | [loadable, retry, forceUpdate]
107 | );
108 | }
109 |
110 | /**
111 | * short version of {@link useImported}
112 | * @param {Function} importer - an function with `import` inside it
113 | *
114 | * @return {Object}
115 | * - imported: if non empty - the data is loaded
116 | * - error: if non empty - there is an error
117 | * - loading: if true - then it's still loading
118 | * - loadable: the under laying reference
119 | * - retry: retry if case of failure
120 | *
121 | * @example
122 | * const { imported: Imported, loadable } = useImported(importer);
123 | * if (Imported) {
124 | * // yep, it's imported
125 | * return ;
126 | * }
127 | * // else throw resolution
128 | * throw loadable.resolution;
129 | */
130 | export function useImported(importer: DefaultImport | Loadable): ImportedShape;
131 | /**
132 | * The code splitting hook, the full version
133 | * @param {Function} importer - an function with `import` inside it
134 | * @param {Function} [exportPicker] - a "picker" of the export inside
135 | * @param {HookOptions} options
136 | * @param {Boolean} [options.import=true] - should the component be imported. Allow to defer execution.
137 | * @param {Boolean} [options.track=true] - allows disabling tracking of components, isolating them to SSR
138 | *
139 | * @return {Object}
140 | * - imported: if non empty - the data is loaded
141 | * - error: if non empty - there is an error
142 | * - loading: if true - then it's still loading
143 | * - loadable: the under laying reference
144 | * - retry: retry if case of failure
145 | *
146 | * @see if you dont need precise control consider(and loading Components) {@link useLazy}
147 | *
148 | * @example
149 | * const { imported: Imported, loadable } = useImported(importer, ({namedExport} => namedExport);
150 | * @example
151 | * const { imported: Imported, loadable } = useImported(importer);
152 | * if (Imported) {
153 | * // yep, it's imported
154 | * return ;
155 | * }
156 | * // else throw resolution
157 | * throw loadable.resolution;
158 | */
159 | export function useImported(
160 | importer: DefaultImport | Loadable,
161 | exportPicker: undefined | ((x: T) => K),
162 | options?: HookOptions
163 | ): ImportedShape;
164 |
165 | export function useImported(
166 | importer: DefaultImport | Loadable,
167 | exportPicker: undefined | ((x: T) => K) = es6import,
168 | options: HookOptions = {}
169 | ): ImportedShape {
170 | const topLoadable = getLoadable(importer);
171 | const { loadable, retry } = useLoadable(topLoadable, options);
172 |
173 | const { error, done, payload } = loadable;
174 | const loading = loadable.isLoading();
175 |
176 | return useMemo(() => {
177 | if (error) {
178 | return {
179 | error,
180 | loadable,
181 | retry,
182 | };
183 | }
184 |
185 | if (done) {
186 | return {
187 | imported: exportPicker(payload as T),
188 | loadable,
189 | retry,
190 | };
191 | }
192 |
193 | return {
194 | loading,
195 | loadable,
196 | retry,
197 | };
198 | }, [error, loading, payload, loadable]);
199 | }
200 |
201 | /**
202 | * A mix of React.lazy and useImported - uses React.lazy for Component and `useImported` to track the promise
203 | * not "retry"-able
204 | * @see if you need precise control consider {@link useImported}
205 | * @example
206 | * const Component = useLazy(() => import('./MyComponent');
207 | * return // throws to SuspenseBoundary if not ready
208 | */
209 | export function useLazy(importer: DefaultComponentImport): LazyExoticComponent> {
210 | const [{ resolve, reject, lazyComponent }] = useState(() => {
211 | /* tslint:disable no-shadowed-variable */
212 | let resolve: any;
213 | let reject: any;
214 | const promise = new Promise>((rs, rej) => {
215 | resolve = rs;
216 | reject = rej;
217 | });
218 |
219 | return {
220 | resolve,
221 | reject,
222 | lazyComponent: lazy(() => promise),
223 | };
224 | /* tslint:enable */
225 | });
226 |
227 | const { error, imported } = useImported(importer);
228 |
229 | useEffect(() => {
230 | if (error) {
231 | reject!(error);
232 | }
233 |
234 | if (imported) {
235 | resolve!(imported);
236 | }
237 | }, [error, imported]);
238 |
239 | return lazyComponent;
240 | }
241 |
--------------------------------------------------------------------------------
/src/utils/detectBackend.ts:
--------------------------------------------------------------------------------
1 | import { isNode } from 'detect-node-es';
2 |
3 | export const isBackend = isNode || typeof window === 'undefined';
4 |
--------------------------------------------------------------------------------
/src/utils/helpers.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * helper function to remap imports
3 | * @param x
4 | * @param map
5 | */
6 | export function remapImports(x: Promise, map: (a: T) => Y): Promise {
7 | return x.then(map);
8 | }
9 |
--------------------------------------------------------------------------------
/src/utils/signatures.ts:
--------------------------------------------------------------------------------
1 | import { AnyFunction, Mark } from '../types';
2 |
3 | const trimImport = (str: string) => str.replace(/['"]/g, '');
4 |
5 | export const importMatch = (functionString: string): Mark => {
6 | const markMatches = functionString.match(/`imported_(.*?)_component`/g) || [];
7 |
8 | return markMatches.map((match) => match && trimImport((match.match(/`imported_(.*?)_component`/i) || [])[1]));
9 | };
10 |
11 | /**
12 | * the intention of this function is to "clear some (minification) noise from the function
13 | * basically from file to file different "short" names could be used
14 | * @param fn
15 | */
16 | export const getFunctionSignature = (fn: AnyFunction | string): string =>
17 | String(fn)
18 | // quotes
19 | .replace(/(["'])/g, '`')
20 |
21 | // comments
22 | .replace(/\/\*([^\*]*)\*\//gi, '')
23 |
24 | // webpack specific
25 | .replace(/Promise.resolve\([^)]*\)/, '-we()')
26 | .replace(/\w+.e\([^)]*\)/, '-we()')
27 | .replace(/\w+.\w.bind\(/, '-wbind(')
28 | .replace(/\w+.bind\(/, '-wbind(')
29 |
30 | // prefix imported
31 | .replace(/([A-z0-9_]+)\(`imported_/g, '$(`imported_');
32 |
--------------------------------------------------------------------------------
/src/utils/useClientPhase.tsx:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react';
2 |
3 | import { importedState } from '../ui/ImportedController';
4 |
5 | /**
6 | * returns "true" if currently is a "client" phase and all features should be active
7 | * @see {@link HydrationController}
8 | */
9 | export const useIsClientPhase = (): boolean => {
10 | const value = useContext(importedState);
11 |
12 | if (!value) {
13 | if (process.env.NODE_ENV !== 'production') {
14 | // tslint:disable-next-line:no-console
15 | console.warn('react-imported-component: please wrap your entire application with ImportedController');
16 | }
17 |
18 | return true;
19 | }
20 |
21 | return value.pastHydration;
22 | };
23 |
--------------------------------------------------------------------------------
/src/utils/utils.ts:
--------------------------------------------------------------------------------
1 | import { Default } from '../types';
2 |
3 | // eslint-disable-next-line @typescript-eslint/ban-types
4 | type ObjectOrFunction = object | (() => any);
5 |
6 | export function asDefault(mayBeNotDefault: T | Default): Default {
7 | if ('default' in mayBeNotDefault) {
8 | return mayBeNotDefault;
9 | }
10 |
11 | return {
12 | default: mayBeNotDefault,
13 | };
14 | }
15 |
16 | export const es6import = (module: any) => (module.default ? module.default : module);
17 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "esModuleInterop": true,
4 | "allowSyntheticDefaultImports": true,
5 | "strict": true,
6 | "strictNullChecks": true,
7 | "strictFunctionTypes": true,
8 | "noImplicitThis": true,
9 | "alwaysStrict": true,
10 | "noUnusedLocals": true,
11 | "noUnusedParameters": true,
12 | "noImplicitReturns": true,
13 | "noFallthroughCasesInSwitch": true,
14 | "noImplicitAny": true,
15 | "removeComments": false,
16 | "importHelpers": true,
17 | "target": "es6",
18 | "moduleResolution": "node",
19 | "lib": ["dom", "es5", "scripthost", "es2015.collection", "es2015.symbol", "es2015.iterable", "es2015.promise"],
20 | "types": ["node", "jest"],
21 | "typeRoots": ["./node_modules/@types"],
22 | "jsx": "react"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["tslint:recommended", "tslint-react", "tslint-react-hooks", "tslint-config-prettier"],
3 | "linterOptions": {
4 | "exclude": ["node_modules/**/*.ts"]
5 | },
6 | "rules": {
7 | "no-bitwise": false,
8 | "quotemark": [true, "single", "jsx-double"],
9 | "no-unused-expression": [true, "allow-fast-null-checks"],
10 | "object-literal-sort-keys": false,
11 | "interface-name": false,
12 | "no-var-requires": false,
13 | "jsx-no-lambda": false,
14 | "max-classes-per-file": false,
15 | "jsx-self-close": false
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/wrapper.js:
--------------------------------------------------------------------------------
1 | var importedWrapper = function(marker, realImport) {
2 | if (typeof __deoptimization_sideEffect__ !== 'undefined') {
3 | __deoptimization_sideEffect__(marker, realImport);
4 | }
5 | return realImport;
6 | };
7 |
8 | module.exports = importedWrapper;
9 |
--------------------------------------------------------------------------------