feat(docs): add more examples

fjc0k · Apr 14, 2021 · 11a297e · 11a297e
1 parent 59b9c3a
commit 11a297e
Show file tree

Hide file tree

Showing 25 changed files with 152 additions and 11 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -3,3 +3,4 @@ node_modules
 lib
 dist
 out
+__*__
diff --git a/.prettierignore b/.prettierignore
@@ -4,3 +4,4 @@ yarn.lock
 pnpm-lock.yaml
 lib
 dist
+__*__
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,11 +1,12 @@
 // Place your settings in this file to overwrite default and user settings.
 {
-    "files.exclude": {
-        "out": false // set this to true to hide the "out" folder with the compiled JS files
-    },
-    "search.exclude": {
-        "out": true // set this to false to include "out" folder in search results
-    },
-    // Turn off tsc task auto detection since we have the necessary tasks as npm scripts
-    "typescript.tsc.autoDetect": "off"
-}
+  "files.exclude": {
+    "out": false // set this to true to hide the "out" folder with the compiled JS files
+  },
+  "search.exclude": {
+    "out": true // set this to false to include "out" folder in search results
+  },
+  // Turn off tsc task auto detection since we have the necessary tasks as npm scripts
+  "typescript.tsc.autoDetect": "off",
+  "typescript.tsdk": "node_modules/typescript/lib"
+}
diff --git a/README.md b/README.md
@@ -65,6 +65,47 @@ In any file, simply invoke command `Generate Index` to generate a file list.
   // @endindex
   ```
 
+- Example 4: exports all `./*.tsx?` and `./*/index.tsx?` files.
+
+  ```js
+  // @index(['./*.{ts,tsx}', './*/index.{ts,tsx}'], f => `export * from '${f.path.replace(/\/index$/, '')}'`)
+  export * from './components'
+  export * from './types'
+  export * from './utils'
+  // @endindex
+  ```
+
+- Example 5: produces the type of the `IconName`
+
+  <!-- prettier-ignore -->
+  ```js
+  export type IconName =
+    // @index(['./icons/*.svg'], (f, _, e) => `'${f.name}'${e.isLast ? '' : ' |'}`)
+    'arrow' |
+    'home' |
+    'pass' |
+    'picture' |
+    'user'
+    // @endindex
+  ```
+
+- Example 6: imports all scripts
+
+  <!-- prettier-ignore -->
+  ```html
+  <html>
+    <head>
+      <!-- @index('./*.js', f => `<script type="text/javascript" src="${f.path}${f.ext}"></script>`) -->
+      <script type="text/javascript" src="./jssdk.js"></script>
+      <script type="text/javascript" src="./polyfill.js"></script>
+      <!-- @endindex -->
+    </head>
+    <body>
+      ...
+    </body>
+  </html>
+  ```
+
 ## @index()
 
 `index` is a function, used for producing index:

diff --git a/package.json b/package.json
@@ -110,6 +110,7 @@
     "ts-jest": "^25.3.1",
     "ts-node": "^8.8.2",
     "typescript": "^3",
+    "typescript-snapshots-plugin": "^1.7.0",
     "vscode": "^1.1.28"
   },
   "engines": {

diff --git a/src/IndexGenerator.test.ts b/src/IndexGenerator.test.ts
@@ -9,6 +9,9 @@ const indexFilePaths = [
   join(__dirname, './__fixtures__/sort/index2.ts'),
   join(__dirname, './__fixtures__/invalid/empty'),
   join(__dirname, './__fixtures__/invalid/error'),
+  join(__dirname, './__fixtures__/all_ts_tsx/index.ts'),
+  join(__dirname, './__fixtures__/types/index.ts'),
+  join(__dirname, './__fixtures__/scripts/index.html'),
 ]
 
 test('ok', async () => {

diff --git a/src/__fixtures__/all_ts_tsx/a.ts b/src/__fixtures__/all_ts_tsx/a.ts
diff --git a/src/__fixtures__/all_ts_tsx/b.ts b/src/__fixtures__/all_ts_tsx/b.ts
diff --git a/src/__fixtures__/all_ts_tsx/c.tsx b/src/__fixtures__/all_ts_tsx/c.tsx
diff --git a/src/__fixtures__/all_ts_tsx/d/index.ts b/src/__fixtures__/all_ts_tsx/d/index.ts
diff --git a/src/__fixtures__/all_ts_tsx/e/hello.ts b/src/__fixtures__/all_ts_tsx/e/hello.ts
diff --git a/src/__fixtures__/all_ts_tsx/index.ts b/src/__fixtures__/all_ts_tsx/index.ts
@@ -0,0 +1,3 @@
+// @index(['./*.{ts,tsx}', './*/index.{ts,tsx}'], f => `export * from '${f.path.replace(/\/index$/, '')}'`)
+
+// @endindex
diff --git a/src/__fixtures__/all_ts_tsx/j/index.tsx b/src/__fixtures__/all_ts_tsx/j/index.tsx
diff --git a/src/__fixtures__/scripts/index.html b/src/__fixtures__/scripts/index.html
@@ -0,0 +1,9 @@
+<html>
+  <head>
+    <!-- @index('./*.js', f => `<script type="text/javascript" src="${f.path}${f.ext}"></script>`) -->
+    <!-- @endindex -->
+  </head>
+  <body>
+    ...
+  </body>
+</html>
diff --git a/src/__fixtures__/scripts/jssdk.js b/src/__fixtures__/scripts/jssdk.js
diff --git a/src/__fixtures__/scripts/polyfill.js b/src/__fixtures__/scripts/polyfill.js
diff --git a/src/__fixtures__/types/icons/arrow.svg b/src/__fixtures__/types/icons/arrow.svg
diff --git a/src/__fixtures__/types/icons/home.svg b/src/__fixtures__/types/icons/home.svg
diff --git a/src/__fixtures__/types/icons/pass.svg b/src/__fixtures__/types/icons/pass.svg
diff --git a/src/__fixtures__/types/icons/picture.svg b/src/__fixtures__/types/icons/picture.svg
diff --git a/src/__fixtures__/types/icons/user.svg b/src/__fixtures__/types/icons/user.svg
diff --git a/src/__fixtures__/types/index.ts b/src/__fixtures__/types/index.ts
@@ -0,0 +1,4 @@
+export type IconName =
+  // @index(['./icons/*.svg'], (f, _, e) => `'${f.name}'${e.isLast ? '' : ' |'}`)
+
+  // @endindex
diff --git a/src/__snapshots__/IndexGenerator.test.ts.snap b/src/__snapshots__/IndexGenerator.test.ts.snap
@@ -1,9 +1,30 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`ok: generated content of /all_ts_tsx/index.ts 1`] = `
+"// @index(['./*.{ts,tsx}', './*/index.{ts,tsx}'], f => \`export * from '\${f.path.replace(/\\\\/index$/, '')}'\`)
+export * from './a'
+export * from './b'
+export * from './c'
+export * from './d'
+export * from './j'
+// @endindex
+"
+`;
+
 exports[`ok: generated content of /cross/index.txt 1`] = `
 "# @index('../**/*', f => \`\${f.path}\${f.ext}\`, { onlyFiles: true })
+../all_ts_tsx/a.ts
+../all_ts_tsx/b.ts
+../all_ts_tsx/c.tsx
+../all_ts_tsx/d/index.ts
+../all_ts_tsx/e/hello.ts
+../all_ts_tsx/index.ts
+../all_ts_tsx/j/index.tsx
 ../invalid/empty
 ../invalid/error
+../scripts/index.html
+../scripts/jssdk.js
+../scripts/polyfill.js
 ../scss/a.scss
 ../scss/b.scss
 ../scss/c.scss
@@ -20,13 +41,26 @@ exports[`ok: generated content of /cross/index.txt 1`] = `
 ../sort/index.ts
 ../sort/index2.ts
 ../sort/国家.ts
+../types/icons/arrow.svg
+../types/icons/home.svg
+../types/icons/pass.svg
+../types/icons/picture.svg
+../types/icons/user.svg
+../types/index.ts
 # @endindex
 
 # @index('../**/*', f => \`\${f.path}\${f.ext}\`, { onlyDirectories: true })
+../all_ts_tsx
+../all_ts_tsx/d
+../all_ts_tsx/e
+../all_ts_tsx/j
 ./
 ../invalid
+../scripts
 ../scss
 ../sort
+../types
+../types/icons
 # @endindex
 
     ! @index('../**/*.scss', (f, _, {isFirst}) => \`\${isFirst ? '****' : ''}\${f.path}\${f.ext}\`)
@@ -45,6 +79,21 @@ exports[`ok: generated content of /invalid/error 1`] = `
 "
 `;
 
+exports[`ok: generated content of /scripts/index.html 1`] = `
+"<html>
+  <head>
+    <!-- @index('./*.js', f => \`<script type=\\"text/javascript\\" src=\\"\${f.path}\${f.ext}\\"></script>\`) -->
+    <script type=\\"text/javascript\\" src=\\"./jssdk.js\\"></script>
+    <script type=\\"text/javascript\\" src=\\"./polyfill.js\\"></script>
+    <!-- @endindex -->
+  </head>
+  <body>
+    ...
+  </body>
+</html>
+"
+`;
+
 exports[`ok: generated content of /scss/index.scss 1`] = `
 "// @index('./*', f => \`@import '\${f.path}\${f.ext}';\`)
 @import './a.scss';
@@ -87,6 +136,20 @@ export * from './国家'
 "
 `;
 
+exports[`ok: generated content of /types/index.ts 1`] = `
+"export type IconName =
+  // @index(['./icons/*.svg'], (f, _, e) => \`'\${f.name}'\${e.isLast ? '' : ' |'}\`)
+  'arrow' |
+  'home' |
+  'pass' |
+  'picture' |
+  'user'
+  // @endindex
+"
+`;
+
+exports[`ok: messages of /all_ts_tsx/index.ts 1`] = `Array []`;
+
 exports[`ok: messages of /cross/index.txt 1`] = `Array []`;
 
 exports[`ok: messages of /invalid/empty 1`] = `
@@ -102,8 +165,12 @@ Array [
 ]
 `;
 
+exports[`ok: messages of /scripts/index.html 1`] = `Array []`;
+
 exports[`ok: messages of /scss/index.scss 1`] = `Array []`;
 
 exports[`ok: messages of /sort/index.ts 1`] = `Array []`;
 
 exports[`ok: messages of /sort/index2.ts 1`] = `Array []`;
+
+exports[`ok: messages of /types/index.ts 1`] = `Array []`;
diff --git a/src/cli.ts b/src/cli.ts
@@ -27,7 +27,7 @@ const argv = yargs
   .demandCommand(1, '').argv
 
 generateManyIndex({
-  patterns: argv._,
+  patterns: argv._.map(String),
   replaceFile: true,
   cwd: argv.cwd,
   watch: argv.watch as any,

diff --git a/tsconfig.json b/tsconfig.json
@@ -11,6 +11,16 @@
     "resolveJsonModule": true,
     "preserveSymlinks": true,
     "strict": true,
-    "newLine": "lf"
+    "newLine": "lf",
+    "plugins": [
+      {
+        "name": "typescript-snapshots-plugin",
+        "snapshotCallIdentifiers": [
+          "toMatchSnapshot",
+          "toThrowErrorMatchingSnapshot",
+          "toMatchDiffSnapshot"
+        ]
+      }
+    ]
   }
 }