@spicemod/creator 0.0.26 → 0.0.28

package/templates/theme/js/react/src/app.jsx

@@ -1,5 +1,5 @@
 import { createRoot } from "react-dom/client";
-// you can use aliases too ! (just add them to tsconfig.json)
+// you can use aliases too ! (checkout tsconfig.app.json)
 import OnboardingCard from "@/components/Onboarding";
 
 const config = {

package/templates/theme/shared/spice.config.js

@@ -1,3 +1,4 @@
+import { resolve } from "path";
 import { defineConfig } from "@spicetify/creator";
 
 // Learn more: {{config-reference-link}}
@@ -7,4 +8,9 @@ export default defineConfig({
   linter: "{{linter}}",
   template: "{{template}}",
   packageManager: "{{package-manager}}",
+  esbuildOptions: {
+    alias: {
+      "@": resolve(__dirname, "src"),
+    },
+  },
 });

package/templates/theme/shared/spice.config.ts

@@ -1,3 +1,4 @@
+import { resolve } from "path";
 import { defineConfig } from "@spicetify/creator";
 
 // Learn more: {{config-reference-link}}
@@ -7,4 +8,9 @@ export default defineConfig({
   linter: "{{linter}}",
   template: "{{template}}",
   packageManager: "{{package-manager}}",
+  esbuildOptions: {
+    alias: {
+      "@": resolve(__dirname, "src"),
+    },
+  },
 });

package/templates/theme/shared/tsconfig.app.json

@@ -0,0 +1,33 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "types": ["@spicetify/creator/client"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true,
+
+    // Paths
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["src"]
+}

package/templates/theme/shared/tsconfig.node.json

@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "target": "ES2023",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "types": ["node"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["spice.config.ts"]
+}

package/templates/theme/ts/react/src/app.tsx

@@ -1,5 +1,5 @@
 import { createRoot } from "react-dom/client";
-// you can use aliases too ! (just add them to tsconfig.json)
+// you can use aliases too ! (checkout tsconfig.app.json)
 import Onboarding from "@/components/Onboarding";
 
 const config = {