tailwindcss + nuxt3.js template

Last update: Nov 6, 2022

Related tags

Overview

TailNuxt template

This is a Nuxt3 port of the Tailnext template.

This was my first attempt to translate an existing template from react to vue, so there may be some errors. Pull requests are welcome.

Built from Scratch - Nuxt3 with tailwindcss

This repo was built from scratch.

If you just want to use the Tailnuxt template, simply clone this repo and build.

If you don't want to use this template but want to build Nuxt3 with Tailwindcss from scratch, here are the instructions. We used RC12 version of Nuxt3.

npx nuxi init nuxt-app
yarn add -D tailwindcss@latest postcss@latest autoprefixer@latest
yarn add -D @nuxtjs/tailwindcss
yarn dev

Edit nuxt.config.ts to be:

export default defineNuxtConfig({
      buildModules: ['@nuxtjs/tailwindcss']
})

Then, do the following:

remove App.vue
create pages directory
add index.vue and your vue content accordingly.

More Nuxt 3 Resources

Links to components used in this template:

Nuxt 3 Minimal Starter

Look at the nuxt 3 documentation to learn more.

Setup

Make sure to install the dependencies:

# yarn
yarn install

# npm
npm install

# pnpm
pnpm install --shamefully-hoist

Development Server

Start the development server on http://localhost:3000

npm run dev

Production

Build the application for production:

npm run build

Locally preview production build:

npm run preview

Checkout the deployment documentation for more information.

Comments

Bump loader-utils from 2.0.3 to 2.0.4
Bumps loader-utils from 2.0.3 to 2.0.4.

Release notes

Sourced from loader-utils's releases.

v2.0.4

2.0.4 (2022-11-11)

Bug Fixes

ReDoS problem (#225) (ac09944)

Changelog

Sourced from loader-utils's changelog.

2.0.4 (2022-11-11)

Bug Fixes

ReDoS problem (#225) (ac09944)

Commits

6688b50 chore(release): 2.0.4

ac09944 fix: ReDoS problem (#225)

See full diff in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

@dependabot use these labels will set the current labels as the default for future PRs for this repo and language

@dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language

@dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language

@dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

dependencies
opened by dependabot[bot] 1

A terminal style interactive website built with Nuxt3.

Terminal.me A terminal style website. The Nuxt3 version of m4tt72/terminal. Motivation Unix-like amateur Frontend/Web enthusiast Vue/Nuxt fan Open sou

4 Jan 7, 2023

This template allows you to quickly scaffold a Vue project with Vue Router, VueX, TailwindCss with JIT Compiler and vite as a bundler.

57 Jul 5, 2022

This template should help get you started developing with Vue 3, Typescript and Tailwindcss in Vite.

Starter Vue 3 + Typescript + Vite + Tailwindcss This template should help get you started developing with Vue 3, Typescript and Tailwindcss in Vite. T

13 Jun 14, 2022

Full stack Nuxt 3 Template starter with Supabase and Tailwindcss

Top Nuxt 3 Starter Template Fastest and most comfortable development experience started template With 💚 from @ctwhome, inspired by @antfu vitesse Fea

95 Dec 28, 2022

Simple Vue-js project template for hackathon based on tailwindcss

15 Nov 8, 2022

Free & open-source template to create a curated directory of websites without (or with) codeFree & open-source template to create a curated directory of websites without (or with) code

CuratedStack Nocode Template 📑 Free & open-source template to create a curated directory of websites without (or with) code 👉 Check the demo website

4 Jul 1, 2022

Template creates with Vite that includes a Vue 3 app template with routes and store. Regarding css we use Tailwind CSS

4 Aug 3, 2022

😍 Awesome Vue Boilerplate 🥳 Vue 🥰 Vuex, vuex-pathify 🤗 element-ui 🤲 tailwindcss

Awesome Vue Boilerplate This is an ever-evolving, very opinionated architecture and dev environment for new Vue SPA projects using Vue CLI 3. Getting

61 Oct 20, 2022

Dark themed, SEO friendly: Nuxt Content + TailwindCSS + Firebase + i18n + RSS2 based SPA for procrastinating developers to quickly spin up their own kickass blog and showcase their projects.

Dark themed, SEO friendly: Nuxt Content + TailwindCSS + Firebase + i18n based SPA for procrastinating developers to quickly spin up their own kickass blog and showcase their projects.