Wed Jan 17 17:57:00 CST 2024 inscode

.inscode

 run = "npm i && npm run dev"
+language = "node"
 
 [deployment]
 build = "npm i && npm run build"
@@ -8,3 +9,6 @@ run = "npm run preview"
 PATH = "/root/${PROJECT_DIR}/.config/npm/node_global/bin:/root/${PROJECT_DIR}/node_modules/.bin:${PATH}"
 XDG_CONFIG_HOME = "/root/.config"
 npm_config_prefix = "/root/${PROJECT_DIR}/.config/npm/node_global"
+
+[debugger]
+program = "main.js"

package.json

@@ -12,6 +12,9 @@
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^3.0.1",
+    "autoprefixer": "^10.4.16",
+    "postcss": "^8.4.33",
+    "tailwindcss": "^3.4.1",
     "vite": "^3.0.1"
   }
 }

src/App.vue

@@ -7,7 +7,10 @@ import TheWelcome from './components/TheWelcome.vue'
   <header>
     <img alt="Vue logo" class="logo" src="./assets/logo.svg" width="125" height="125" />
 
-    <div class="wrapper">
+    <div class="wrapper bg-slate-300">
+      <h1 class="text-3xl font-bold underline">
+        Hello world!
+      </h1>
       <HelloWorld msg="You did it!" />
     </div>
   </header>

src/main.js

 import { createApp } from 'vue'
 import App from './App.vue'
 
-import './assets/main.css'
+import './style.css'
+
+// import './assets/main.css'
 
 createApp(App).mount('#app')

src/style.css

+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file

tailwind.config.js

+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{vue,js,ts,jsx,tsx}",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
\ No newline at end of file