wip

Author: Mohsen Azimi

.gitignore

@@ -2,4 +2,4 @@ node_modules
 dist
 .DS_Store
 coverage/
-.log
+*.log

.vscode/launch.json

@@ -2,28 +2,22 @@
     "version": "0.2.0",
     "configurations": [
         {
-            "args": [],
-            "cwd": "${workspaceRoot}",
-            "env": {
-                "NODE_ENV": "test"
-            },
-            "console": "internalConsole",
-            "name": "Run Tests",
-            "outFiles": ["${workspaceRoot}/dist"],
-            "preLaunchTask": "tsc",
-            "program": "${workspaceRoot}/node_modules/.bin/jest",
+            "type": "node",
             "request": "launch",
-            "runtimeArgs": [],
-            "runtimeExecutable": null,
-            "sourceMaps": true,
-            "stopOnEntry": false,
-            "type": "node"
+            "name": "Jest All",
+            "program": "${workspaceFolder}/node_modules/jest/bin/jest",
+            "args": ["--runInBand"],
+            "console": "integratedTerminal",
+            "internalConsoleOptions": "neverOpen"
         },
         {
-            "name": "Attach",
             "type": "node",
-            "request": "attach",
-            "port": 5858
+            "request": "launch",
+            "name": "Jest A single case (edit config)",
+            "program": "${workspaceFolder}/node_modules/jest/bin/jest",
+            "args": ["-t", "remove-default-export-variable-assignment-transform basic"],
+            "console": "integratedTerminal",
+            "internalConsoleOptions": "neverOpen"
         }
     ]
 }

README.md

@@ -5,6 +5,7 @@
 Transforms React code written in JavaScript to TypeScript.
 
 [**🖥 Download the VSCode Extension**](https://marketplace.visualstudio.com/items?itemName=mohsen1.react-javascript-to-typescript-transform-vscode)
+
 ## Features:
 
 * Proxies `PropTypes` to `React.Component` generic type and removes PropTypes

src/index.ts

@@ -9,6 +9,7 @@ import { collapseIntersectionInterfacesTransformFactoryFactory } from './transfo
 import { reactRemoveStaticPropTypesMemberTransformFactoryFactory } from './transforms/react-remove-static-prop-types-member-transform';
 import { reactStatelessFunctionMakePropsTransformFactoryFactory } from './transforms/react-stateless-function-make-props-transform';
 import { reactRemovePropTypesImportTransformFactoryFactory } from './transforms/react-remove-prop-types-import';
+import { removeDefaultExportVariableAssignmentTransformFactoryFactory } from './transforms/remove-default-export-variable-assignment-transform';
 
 export {
     reactMovePropTypesToClassTransformFactoryFactory,
@@ -18,6 +19,7 @@ export {
     reactRemovePropTypesAssignmentTransformFactoryFactory,
     reactRemoveStaticPropTypesMemberTransformFactoryFactory,
     reactRemovePropTypesImportTransformFactoryFactory,
+    removeDefaultExportVariableAssignmentTransformFactoryFactory,
     compile,
 };
 
@@ -29,6 +31,7 @@ export const allTransforms = [
     reactRemovePropTypesAssignmentTransformFactoryFactory,
     reactRemoveStaticPropTypesMemberTransformFactoryFactory,
     reactRemovePropTypesImportTransformFactoryFactory,
+    removeDefaultExportVariableAssignmentTransformFactoryFactory,
 ];
 
 export type TransformFactoryFactory = (typeChecker: ts.TypeChecker) => ts.TransformerFactory<ts.SourceFile>;

src/transforms/remove-default-export-variable-assignment-transform.ts

@@ -0,0 +1,67 @@
+import * as ts from 'typescript';
+import * as _ from 'lodash';
+
+import * as helpers from '../helpers';
+
+/**
+ * Remove default export variable assignment
+ *
+ * @example
+ * Before:
+ * export default const foo: string = 'str';
+ *
+ * After
+ * const foo: string = 'str';
+ * export default foo;
+ */
+export function removeDefaultExportVariableAssignmentTransformFactoryFactory(
+    typeChecker: ts.TypeChecker,
+): ts.TransformerFactory<ts.SourceFile> {
+    return function removeDefaultExportVariableAssignmentTransformFactory(context: ts.TransformationContext) {
+        return function removeDefaultExportVariableAssignmentTransform(sourceFile: ts.SourceFile) {
+            const visited = visitSourceFile(sourceFile, typeChecker);
+            ts.addEmitHelpers(visited, context.readEmitHelpers());
+            return visited;
+        };
+    };
+}
+
+function visitSourceFile(sourceFile: ts.SourceFile, typeChecker: ts.TypeChecker) {
+    let statements = _.toArray(sourceFile.statements);
+    const newStatements = [];
+
+    let index = 0;
+    while (index < statements.length) {
+        const statement = statements[index];
+        const nextStatement = statements[index + 1];
+        let statementText;
+        try {
+            statementText = statement.getText();
+        } catch {}
+
+        if (
+            nextStatement &&
+            ts.isExportAssignment(statement) &&
+            statementText === 'export default' &&
+            ts.isVariableStatement(nextStatement)
+        ) {
+            // push variable declaration
+            newStatements.push(nextStatement);
+
+            // push export default for variable declaration
+            const identifer = ts.createIdentifier(
+                nextStatement.declarationList.declarations[0] &&
+                    nextStatement.declarationList.declarations[0].name.getText(),
+            );
+            const defaultExport = ts.createExportDefault(identifer);
+            newStatements.push(defaultExport);
+
+            // skip next statement because we pushed nextStatement already
+            index++;
+        } else {
+            newStatements.push(statement);
+        }
+        index++;
+    }
+    return ts.updateSourceFileNode(sourceFile, newStatements);
+}

test/end-to-end/stateless-function-exported-default/input.tsx

@@ -0,0 +1,7 @@
+export default function Hello({ message }) {
+  return <div>hello {message}</div>
+}
+
+Hello.propTypes = {
+  message: React.PropTypes.string,
+}

test/end-to-end/stateless-function-exported-default/output.tsx

@@ -0,0 +1,8 @@
+type HelloProps = {
+    message?: string,
+};
+const Hello: React.SFC<HelloProps> = ({ message }) => {
+    return <div>hello {message}</div>;
+};
+
+export default Hello;

test/remove-default-export-variable-assignment-transform/basic/input.tsx

@@ -0,0 +1 @@
+export default const foo: string = 'str';

test/remove-default-export-variable-assignment-transform/basic/output.tsx

@@ -0,0 +1,2 @@
+const foo: string = 'str';
+export default foo;

test/transformers.test.ts

@@ -17,6 +17,7 @@ import {
     reactRemoveStaticPropTypesMemberTransformFactoryFactory,
     collapseIntersectionInterfacesTransformFactoryFactory,
     reactRemovePropTypesImportTransformFactoryFactory,
+    removeDefaultExportVariableAssignmentTransformFactoryFactory,
     allTransforms,
     compile,
     TransformFactoryFactory
@@ -32,6 +33,7 @@ const transformToFolderMap: [string, TransformFactoryFactory[]][] = [
     ['collapse-intersection-interfaces-transform', [collapseIntersectionInterfacesTransformFactoryFactory]],
     ['react-move-prop-types-to-class-transform', [reactMovePropTypesToClassTransformFactoryFactory]],
     ['react-remove-prop-types-import', [reactRemovePropTypesImportTransformFactoryFactory]],
+    ['remove-default-export-variable-assignment-transform', [removeDefaultExportVariableAssignmentTransformFactoryFactory]],
     ['end-to-end', allTransforms],
 ];