Unstable tailwind & esbuild

esbuild.js

@@ -2,12 +2,12 @@ const {build} = require("esbuild");
 const {solidPlugin} = require("esbuild-plugin-solid");
 const path = require("path");
 const fs = require("fs");
+const glob = require("glob");
 
-const files = fs.readdirSync("src")
+glob.glob("./src/**/*.{ts,tsx}")
-    .filter((src) => src.endsWith(".tsx") || src.endsWith(".ts"))
+    .then((files) => {
-    .map((x) => path.resolve(__dirname, "./src/", x));
+        console.log(files);
-
+        build({
-build({
             entryPoints: files,
             minify: false,
             logLevel: "info",
@@ -19,4 +19,5 @@ build({
             })],
             outdir: "dist",
             format: "cjs",
-});
+        });
+    });

esbuild2.js

@@ -1,8 +1,29 @@
-const {build} = require("esbuild");
+const { build } = require("esbuild");
-const {solidPlugin} = require("esbuild-plugin-solid");
+const { solidPlugin } = require("esbuild-plugin-solid");
 const path = require("path");
 const fs = require("fs");
+const { glob } = require("glob");
 
+glob("dist/**/*.jsx")
+    .then((files) => {
+        build({
+            platform: "node",
+            entryPoints: files,
+            bundle: false,
+            minify: false,
+            logLevel: "info",
+            plugins: [solidPlugin({
+                solid: {
+                    generate: "ssr",
+                    hydratable: true,
+                },
+            })],
+            outdir: "dist/src",
+            format: "cjs",
+        });
+    });
+
+/*
 build({
     platform: "node",
     entryPoints: [
@@ -27,3 +48,4 @@ build({
         "cache-manager",
     ],
 });
+ */

nest-cli.json

@@ -3,7 +3,6 @@
   "collection": "@nestjs/schematics",
   "sourceRoot": "src",
   "compilerOptions": {
-    "deleteOutDir": false,
+    "deleteOutDir": false
-    "webpack": true
   }
 }

package.json

@@ -51,18 +51,22 @@
     "@types/supertest": "^2.0.11",
     "@typescript-eslint/eslint-plugin": "^5.0.0",
     "@typescript-eslint/parser": "^5.0.0",
+    "autoprefixer": "^10.4.14",
     "babel-loader": "^9.1.2",
     "babel-preset-solid": "^1.6.9",
     "esbuild": "^0.17.18",
     "esbuild-plugin-solid": "^0.5.0",
     "eslint": "^8.0.1",
     "eslint-config-prettier": "^8.3.0",
+    "glob": "^10.2.2",
     "jest": "29.5.0",
+    "postcss": "^8.4.23",
     "rollup": "^3.21.5",
     "rollup-plugin-copy": "^3.4.0",
     "rollup-route-manifest": "^1.0.0",
     "source-map-support": "^0.5.20",
     "supertest": "^6.1.3",
+    "tailwindcss": "^3.3.2",
     "ts-jest": "29.0.5",
     "ts-loader": "^9.2.3",
     "ts-node": "^10.0.0",

postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

rollup.config.js

@@ -1,78 +0,0 @@
-const nodeResolve = require("@rollup/plugin-node-resolve");
-const common = require("@rollup/plugin-commonjs");
-const babel = require("@rollup/plugin-babel");
-const copy = require("rollup-plugin-copy");
-
-module.exports = [
-    {
-        input: "ssr/index.js",
-        output: [
-            {
-                dir: "ssr/lib",
-                format: "cjs"
-            }
-        ],
-        external: ["solid-js", "solid-js/web", "path", "express", "stream"],
-        plugins: [
-            nodeResolve({ preferBuiltins: true, exportConditions: ["solid", "node"] }),
-            babel({
-                babelHelpers: "bundled",
-                presets: [["solid", { generate: "ssr", hydratable: true }]]
-            }),
-            common()
-        ],
-        preserveEntrySignatures: false
-    },
-    {
-        input: "shared/src/index.js",
-        output: [
-            {
-                dir: "ssr/public/js",
-                format: "cjs"
-            }
-        ],
-        preserveEntrySignatures: false,
-        plugins: [
-            nodeResolve({ exportConditions: ["solid"] }),
-            babel({
-                babelHelpers: "bundled",
-                presets: [["solid", { generate: "dom", hydratable: true }]]
-            }),
-            common(),
-            copy({
-                targets: [
-                    {
-                        src: ["shared/static/*"],
-                        dest: "ssr/public"
-                    }
-                ]
-            })
-        ]
-    },
-    {
-        input: "src/app.tsx",
-        output: [
-            {
-                dir: "dist",
-                format: "cjs"
-            }
-        ],
-        preserveEntrySignatures: false,
-        plugins: [
-            nodeResolve({ exportConditions: ["solid"] }),
-            babel({
-                babelHelpers: "bundled",
-                presets: [["solid", { generate: "dom", hydratable: true }]]
-            }),
-            common(),
-            copy({
-                targets: [
-                    {
-                        src: ["shared/static/*"],
-                        dest: "ssr/public"
-                    }
-                ]
-            })
-        ]
-    }
-];

rollup2.config.js

@@ -1,42 +0,0 @@
-const glob = require("glob");
-const path = require("node:path");
-const { fileURLToPath } = require("node:url");
-const nodeResolve = require("@rollup/plugin-node-resolve");
-const babel = require("@rollup/plugin-babel");
-const common = require("@rollup/plugin-commonjs");
-const copy = require("rollup-plugin-copy");
-
-module.exports = {
-    input: Object.fromEntries(glob.sync("dist/**/*.jsx").map((file) => [
-        // This remove `src/` as well as the file extension from each
-        // file, so e.g. src/nested/foo.js becomes nested/foo
-        path.relative(
-            "dist",
-            file.slice(0, file.length - path.extname(file).length)
-        ),
-        // This expands the relative paths to absolute paths, so e.g.
-        // src/nested/foo becomes /project/src/nested/foo.js
-        file,
-    ])),
-    output: {
-        format: "es",
-        dir: "dist",
-    },
-    preserveEntrySignatures: false,
-    plugins: [
-        nodeResolve({ exportConditions: ["solid"] }),
-        babel({
-            babelHelpers: "bundled",
-            presets: [["solid", { generate: "ssr", hydratable: true }]],
-        }),
-        common(),
-        copy({
-            targets: [
-                {
-                    src: ["shared/static/*"],
-                    dest: "ssr/public",
-                },
-            ],
-        }),
-    ],
-};

src/app.module.ts

@@ -2,6 +2,8 @@ import { Module } from "@nestjs/common";
 import { AppController } from "./app.controller";
 import { AppService } from "./app.service";
 import { TypeOrmModule } from "@nestjs/typeorm";
+import { CatController } from "./controllers/cat.controller";
+import { CatService } from "./controllers/cat.service";
 
 @Module({
     imports: [
@@ -17,7 +19,7 @@ import { TypeOrmModule } from "@nestjs/typeorm";
         }),
          */
     ],
-    controllers: [AppController],
+    controllers: [AppController, CatController],
-    providers: [AppService],
+    providers: [AppService, CatService],
 })
 export class AppModule {}

src/controllers/Cats.tsx

@@ -0,0 +1,8 @@
+export function Cats() {
+    return (
+        <div>
+            Cats :D
+            <p>__cats jsx__</p>
+        </div>
+    );
+}

src/controllers/cat.controller.ts

@@ -0,0 +1,14 @@
+import { Controller, Get } from "@nestjs/common";
+import { CatService } from "./cat.service";
+
+
+@Controller("cats")
+export class CatController {
+    constructor(private catService: CatService) {
+    }
+
+    @Get()
+    async findAll(): Promise<Array<string>> {
+        return this.catService.findAll();
+    }
+}

src/controllers/cat.service.ts

@@ -0,0 +1,13 @@
+import { Injectable } from "@nestjs/common";
+
+@Injectable()
+export class CatService {
+    private readonly cats: Array<string> = [];
+    create(name: string) {
+        this.cats.push(name);
+    }
+
+    findAll(): Array<string> {
+        return this.cats;
+    }
+}

src/index.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

src/solidAppJSX.tsx

@@ -1,6 +1,7 @@
+
 export function SolidAppJSX() {
     return (
-        <div>
+        <div class="text-3xl font-bold underline">
             OMG!! SSR!!!
         </div>
     );

tailwind.config.js

@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    content: [
+        "./src/**/*.{tsx}",
+    ],
+    theme: {
+        extend: {},
+    },
+    plugins: [],
+};
+

webpack.config.js

@@ -1,70 +0,0 @@
-//*
-module.exports = {
-    module: {
-        rules: [
-            // all files with a `.ts`, `.cts`, `.mts` or `.tsx` extension will be handled by `ts-loader`
-            {
-                test: /\.ts(x?)$/,
-                exclude: /node_modules/,
-                use: [
-                    {
-                        loader: "babel-loader",
-                        options: {
-                            plugins: [
-                                // ["@babel/plugin-proposal-decorators", { "version": "2023-01" }],
-                            ],
-                            presets: [
-                                ["solid", { generate: "ssr", hydratable: true }],
-                            ],
-                        },
-                    },
-                    {
-                        loader: "ts-loader",
-                    },
-                ],
-                /*
-                test: /\.[j|t]sx?$/,
-                loader: "babel-loader",
-                exclude: [/node_modules/, /public/],
-                options: {
-                    plugins: [
-                        ["@babel/plugin-proposal-decorators", { "version": "2023-01" }],
-                    ],
-                    presets: [
-                        "@babel/preset-typescript",
-                        ["solid", { generate: "ssr", hydratable: true }],
-                    ],
-                },
-                */
-            },
-            // { test: /\.([cm]?ts|tsx)$/, loader: "ts-loader" },
-        ],
-    },
-};
-// */
-
-/*
-const path = require("path");
-
-module.exports = {
-    entry: "./src/main.ts",
-    module: {
-        rules: [
-            {
-                test: /\.tsx?$/,
-                use: "ts-loader",
-                exclude: /node_modules/,
-            },
-        ],
-    },
-    resolve: {
-        extensions: [".tsx", ".ts", ".js"],
-    },
-    output: {
-        filename: "bundle.js",
-        path: path.resolve(__dirname, "dist"),
-    },
-};
-
-
- */