✨ 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,
  },
 });