Add TS types support for build (#28)

* build ts types.

* fix default export for lib.

package.json

@@ -8,10 +8,11 @@
   },
   "main": "dist/neko.umd.js",
   "module": "dist/neko.common.js",
+  "typings": "dist/types/main.d.ts",
   "scripts": {
     "serve": "vue-cli-service serve --mode development",
     "lint": "vue-cli-service lint",
-    "build": "vue-cli-service build --target lib --name neko ./src/index.ts",
+    "build": "vue-cli-service build --target lib --name neko ./src/lib.ts && ./types-build.sh",
     "build:page": "vue-cli-service build"
   },
   "dependencies": {

src/component/utils/file-upload.ts

@@ -19,6 +19,8 @@ export async function getFilesFromDataTansfer(dataTransfer: DataTransfer): Promi
   }
 
   const promises: Array<Promise<any>> = []
+  // Type 'DataTransferItemList' is not an array type or a string type. Use compiler option '--downlevelIteration' to allow iterating of iterators.
+  // @ts-ignore
   for (const item of dataTransfer.items) {
     if ('webkitGetAsEntry' in item) {
       promises.push(traverse(item.webkitGetAsEntry()))
@@ -29,6 +31,8 @@ export async function getFilesFromDataTansfer(dataTransfer: DataTransfer): Promi
   }
 
   if (promises.length === 0) {
+    // Type 'FileList' is not an array type or a string type. Use compiler option '--downlevelIteration' to allow iterating of iterators.
+    // @ts-ignore
     return [...dataTransfer.files]
   }
 

src/lib.ts

@@ -18,5 +18,4 @@ if (typeof window !== 'undefined' && window.Vue) {
   window.Vue.use(NekoElements, {})
 }
 
-export { Neko }
-export default NekoElements
+export default Neko

types-build.sh

@@ -0,0 +1,50 @@
+#!/bin/bash
+
+rm -rf dist/types
+
+# Find all vue files, and convert them to .ts files
+find src/component -name "*.vue" -type f -print0 | while IFS= read -r -d '' file; do
+    # Get the file name
+    filename=$(basename -- "$file")
+    # Get the file name without extension
+    filename="${filename%.*}"
+    # Get the directory name
+    directory=$(dirname -- "$file")
+    # Get the directory name without the first dot
+    directory="${directory}"
+
+    if [ "$directory" = "" ]; then
+      directory="."
+    fi
+
+    echo "Creating: $file --> $directory/$filename.ts"
+
+    # Get contant of the file, that is between <script lang="ts"> and </script>
+    content=$(sed -n '/<script lang="ts">/,/<\/script>/p' "$file" | sed '1d;$d')
+
+    # Remove .vue in imports
+    content=$(echo "$content" | sed 's/\.vue//g')
+
+    # Create a new file with the same name and .ts extension
+    echo "$content" > "$directory/$filename.ts"
+
+    # Add file to .toDelete file
+    echo "$directory/$filename.ts" >> .toDelete
+done
+
+echo "Compiling files"
+npx tsc -p types-tsconfig.json
+
+# Remove all .js files in dist/types folder
+echo "Removing .js files in dist/types"
+find dist/types -name "*.js" -type f -delete
+
+# Remove all files listed in .toDelete
+echo "Removing files listed in .toDelete"
+while read -r file; do
+  echo "Removing: $file"
+  rm -f "$file"
+done < .toDelete
+
+# Remove .toDelete file
+rm -f .toDelete

types-tsconfig.json

@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "strict": true,
+    "experimentalDecorators": true,
+    "allowSyntheticDefaultImports": true,
+    "declaration": true,
+    "rootDir": "src/component",
+    "outDir": "dist/types",
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  },
+  "include": [
+    "src/component/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}