use ts

fusionfile.mjs

@@ -5,8 +5,9 @@
  * @license    MIT
  */
 
-import fusion, { sass, babel, parallel, wait } from '@windwalker-io/fusion';
-import { jsSync, installVendors, findModules } from '@windwalker-io/core';
+import fusion, { sass, babel, parallel, wait, ts } from '@windwalker-io/fusion';
+import { syncModuleScripts, installVendors, findModules } from '@windwalker-io/core';
+import path from 'path';
 
 export async function mainCSS() {
   // Watch start
@@ -78,41 +79,39 @@ export async function css() {
 }
 export async function js() {
   // Watch start
-  fusion.watch(['resources/assets/src/**/*.{js,mjs}']);
+  fusion.watch([
+    'resources/assets/src/**/*.{js,mjs,ts}',
+    'src/Module/**/assets/**/*.{js,mjs,ts}',
+    ...findModules('**/assets/*.{js,mjs,ts}')
+  ]);
   // Watch end
 
   // Compile Start
   return wait(
     babel('resources/assets/src/**/*.{js,mjs}', 'www/assets/js/', { module: 'systemjs' }),
+    ts('resources/assets/src/**/*.ts', 'www/assets/js/', { tsconfig: 'tsconfig.js.json' }),
     syncJS()
   );
   // Compile end
 }
 
-export async function images() {
-  // Watch start
-  fusion.watch('resources/assets/images/**/*');
-  // Watch end
-
+export async function syncJS() {
   // Compile Start
   return wait(
-    fusion.copy('resources/assets/images/**/*', 'www/assets/images/')
+    ...syncModuleScripts()
   );
   // Compile end
 }
 
-export async function syncJS() {
+export async function images() {
   // Watch start
-  fusion.watch(['src/Module/**/assets/**/*.{js,mjs}', ...findModules('**/assets/*.{js,mjs}')]);
+  fusion.watch('resources/assets/images/**/*');
   // Watch end
 
   // Compile Start
-  const { dest } = await jsSync(
-    'src/Module/',
-    'www/assets/js/view/'
+  return wait(
+    fusion.copy('resources/assets/images/**/*', 'www/assets/images/')
   );
-
-  return babel(dest.path + '**/*.{mjs,js}', null, { module: 'systemjs' });
   // Compile end
 }
 

package.json

@@ -5,8 +5,8 @@
         "build": "cross-env node_modules/.bin/gulp",
         "build:dev": "cross-env NODE_ENV=development node_modules/.bin/gulp",
         "build:prod": "cross-env NODE_ENV=production node_modules/.bin/gulp",
-        "watch": "cross-env NODE_ENV=development node_modules/.bin/gulp --watch=1",
-        "watch:reload": "cross-env NODE_ENV=development node_modules/.bin/gulp --watch=1 --livereload=1",
+        "watch": "cross-env NODE_ENV=development node_modules/.bin/gulp --watching=1",
+        "watch:reload": "cross-env NODE_ENV=development node_modules/.bin/gulp --watching=1 --livereload=1",
         "postinstall": "yarn build install"
     },
     "dependencies": {

resources/assets/src/admin/main.js → resources/assets/src/admin/main.ts

@@ -1,10 +1,3 @@
-/**
- * Part of starter project.
- *
- * @copyright  Copyright (C) 2021 LYRASOFT.
- * @license    __LICENSE__
- */
-
 import '@regenerator-runtime';
 import '@unicorn/unicorn.js';
 import { UIBootstrap5 } from '@unicorn/ui/ui-bootstrap5.js';

resources/assets/src/front/main.js → resources/assets/src/front/main.ts

@@ -1,10 +1,3 @@
-/**
- * Part of starter project.
- *
- * @copyright  Copyright (C) 2021 LYRASOFT.
- * @license    __LICENSE__
- */
-
 import '@regenerator-runtime';
 import '@unicorn/unicorn.js';
 import { UIBootstrap5 } from '@unicorn/ui/ui-bootstrap5.js';

resources/assets/src/types/index.d.ts

@@ -0,0 +1 @@
+import '@windwalker-io/core/types';

src/Module/Front/Home/assets/home.ts

@@ -0,0 +1 @@
+export const Home = {};

tsconfig.js.json

@@ -0,0 +1,17 @@
+{
+    "extends": [
+        "@windwalker-io/core/tsconfig.js.json"
+    ],
+    "include": [
+        "resources/assets/src/**/*.ts",
+        "src/Module/**/*.ts"
+    ],
+    "exclude": [
+        "node_modules/**/*"
+    ],
+    "compilerOptions": {
+        "paths": {
+            "@/*": ["./resources/assets/src/*"]
+        }
+    }
+}

tsconfig.json

@@ -0,0 +1,25 @@
+{
+    "extends": [
+        "@windwalker-io/core/tsconfig.js.json",
+        "@vue/tsconfig/tsconfig.dom.json"
+    ],
+    "include": [
+        "vendor/**/src/Module/**/assets/**/*.ts",
+        "resources/assets/vue/**/*",
+        "resources/assets/vue/**/*.vue",
+        "resources/assets/src/**/*.ts",
+        "src/Module/**/*.ts"
+    ],
+    "exclude": [
+        "node_modules/**/*"
+    ],
+    "types": ["reflect-metadata"],
+    "compilerOptions": {
+        "allowJs": true,
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "paths": {
+            "@/*": ["./resources/assets/vue/*"],
+        }
+    }
+}