WIP: Usage of .figmaexportrc.ts

README.md

@@ -229,6 +229,25 @@ If needed you can also provide a different configuration file.
 }
 ```
 
+#### TypeScript
+
+If you prefer, you can create a `.figmaexportrc.ts` and use TypeScript instead.
+For doing so, you just need to install a few new dependencies in your project,
+
+```sh
+npm install --save-dev typescript ts-node @types/node @figma-export/types
+```
+
+and slightly change your `package.json`
+
+```diff
+{
+  "scripts": {
++   "figma:export": "ts-node ./node_modules/.bin/figma-export use-config .figmaexportrc.ts"
+  }
+}
+```
+
 ## :books: More Packages
 
 For the list of all official packages or if you want to create your own transformer or outputter you can continue reading [CLI Documentation](/packages/cli#readme).

package.json

@@ -9,7 +9,7 @@
   },
   "scripts": {
     "predebug": "yarn build",
-    "debug": "./packages/cli/bin/run use-config",
+    "debug": "./packages/cli/bin/run use-config .figmaexportrc.ts",
     "preinstall": "node -e \"if(process.env.npm_execpath.indexOf('yarn') === -1) throw new Error('You must use Yarn to install, not NPM')\"",
     "clean": "rm -rf node_modules/ output/ */*/node_modules */*/output */*/dist */*/tsconfig.tsbuildinfo",
     "postinstall": "lerna bootstrap",

packages/core/src/lib/export-components.ts

@@ -3,15 +3,6 @@ import { Document } from 'figma-js';
 
 import { getClient, getPages, enrichPagesWithSvg } from './figma';
 
-type Options = {
-    token: string;
-    fileId: string;
-    onlyFromPages?: string[];
-    transformers?: FigmaExport.StringTransformer[];
-    outputters?: FigmaExport.ComponentOutputter[];
-    log?: (msg: string) => void;
-}
-
 export const components = async ({
     token,
     fileId,
@@ -22,7 +13,7 @@ export const components = async ({
         // eslint-disable-next-line no-console
         console.log(msg);
     },
-}: Options): Promise<FigmaExport.PageNode[]> => {
+}: FigmaExport.ExportComponentsOptions): Promise<FigmaExport.PageNode[]> => {
     const client = getClient(token);
 
     log('fetching document');

packages/core/src/lib/export-styles.ts

@@ -3,13 +3,6 @@ import * as FigmaExport from '@figma-export/types';
 import { getClient } from './figma';
 import { fetchStyles, parseStyles } from './figmaStyles';
 
-type Options = {
-    token: string;
-    fileId: string;
-    outputters?: FigmaExport.StyleOutputter[];
-    log?: (msg: string) => void;
-}
-
 export const styles = async ({
     token,
     fileId,
@@ -18,7 +11,7 @@ export const styles = async ({
         // eslint-disable-next-line no-console
         console.log(msg);
     },
-}: Options): Promise<FigmaExport.Style[]> => {
+}: FigmaExport.ExportStylesOptions): Promise<FigmaExport.Style[]> => {
     const client = getClient(token);
 
     log('fetching styles');

packages/types/src/commands.ts

@@ -0,0 +1,27 @@
+import { StringTransformer, ComponentOutputter } from './global';
+import { StyleOutputter } from './styles';
+
+type ExportComponents = {
+    fileId: string;
+    onlyFromPages?: string[];
+    transformers?: StringTransformer[];
+    outputters?: ComponentOutputter[];
+}
+
+type ExportStyles = {
+    fileId: string;
+    outputters?: StyleOutputter[];
+}
+
+type ExportOptions = {
+    token: string;
+    log?: (msg: string) => void;
+}
+
+export type ExportComponentsOptions = ExportOptions & ExportComponents
+
+export type ExportStylesOptions = ExportOptions & ExportStyles
+
+export type CommandUseConfig = {
+    commands: (['components', ExportComponents] | ['styles', ExportStyles])[]
+}

packages/types/src/index.ts

@@ -1,2 +1,3 @@
 export * from './global';
 export * from './styles';
+export * from './commands';