✨ Add tailwindcss template

2021-12-09 18:59:20 +01:00
parent 7b3a742083
commit 5ecf3a157a
12 changed files with 1476 additions and 0 deletions
@@ -0,0 +1,2 @@
+node_modules
+dist
@@ -0,0 +1,33 @@
+## Usage
+
+Those templates dependencies are maintained via [pnpm](https://pnpm.io) via `pnpm up -Lri`.
+
+This is the reason you see a `pnpm-lock.yaml`. That being said, any package manager will work. This file can be safely be removed once you clone a template.
+
+```bash
+$ npm install # or pnpm install or yarn install
+```
+### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm dev` or `npm start`
+
+Runs the app in the development mode.<br>
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+The page will reload if you make edits.<br>
+
+### `npm run build`
+
+Builds the app for production to the `dist` folder.<br>
+It correctly bundles Solid in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.<br>
+Your app is ready to be deployed!
+
+## Deployment
+
+You can deploy the `dist` folder to any static host provider (netlify, surge, now, etc.)
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <title>Solid App</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+
+    <script src="/src/index.tsx" type="module"></script>
+  </body>
+</html>
@@ -0,0 +1,22 @@
+{
+  "name": "vite-template-solid",
+  "version": "0.0.0",
+  "description": "",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "serve": "vite preview"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "autoprefixer": "^10.4.0",
+    "postcss": "^8.4.4",
+    "tailwindcss": "^3.0.0",
+    "typescript": "^4.4.3",
+    "vite": "^2.7.1",
+    "vite-plugin-solid": "^2.1.3"
+  },
+  "dependencies": {
+    "solid-js": "^1.2.6"
+  }
+}
@@ -0,0 +1,7 @@
+module.exports = {
+  purge: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};
@@ -0,0 +1,9 @@
+import type { Component } from "solid-js";
+
+const App: Component = () => {
+  return (
+    <p class="text-4xl text-green-700 text-center py-20">Hello tailwind!</p>
+  );
+};
+
+export default App;
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
@@ -0,0 +1,6 @@
+import "./index.css";
+import { render } from "solid-js/web";
+
+import App from "./App";
+
+render(() => <App />, document.getElementById("root") as HTMLElement);
@@ -0,0 +1,7 @@
+module.exports = {
+  darkMode: false, // or 'media' or 'class'
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+};
@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
+    "types": ["vite/client"]
+  }
+}
@@ -0,0 +1,10 @@
+import { defineConfig } from "vite";
+import solidPlugin from "vite-plugin-solid";
+
+export default defineConfig({
+  plugins: [solidPlugin()],
+  build: {
+    target: "esnext",
+    polyfillDynamicImport: false,
+  },
+});