mirror of
https://github.com/IT4Change/nuxt3-template.git
synced 2025-12-13 05:05:49 +00:00
Ground commit with a working application.
This commit is contained in:
elweyn
parent
6ad5072a1a
commit
53af06c02d
65
README.md
65
README.md
@ -1,2 +1,63 @@
|
|||||||
# nuxt3-template
|
# Nuxt 3 Minimal Starter
|
||||||
Template for Nuxt3 project
|
|
||||||
|
Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
|
||||||
|
|
||||||
|
## Setup
|
||||||
|
|
||||||
|
Make sure to install the dependencies:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# npm
|
||||||
|
npm install
|
||||||
|
|
||||||
|
# pnpm
|
||||||
|
pnpm install
|
||||||
|
|
||||||
|
# yarn
|
||||||
|
yarn install
|
||||||
|
```
|
||||||
|
|
||||||
|
## Development Server
|
||||||
|
|
||||||
|
Start the development server on `http://localhost:3000`:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# npm
|
||||||
|
npm run dev
|
||||||
|
|
||||||
|
# pnpm
|
||||||
|
pnpm run dev
|
||||||
|
|
||||||
|
# yarn
|
||||||
|
yarn dev
|
||||||
|
```
|
||||||
|
|
||||||
|
## Production
|
||||||
|
|
||||||
|
Build the application for production:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# npm
|
||||||
|
npm run build
|
||||||
|
|
||||||
|
# pnpm
|
||||||
|
pnpm run build
|
||||||
|
|
||||||
|
# yarn
|
||||||
|
yarn build
|
||||||
|
```
|
||||||
|
|
||||||
|
Locally preview production build:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# npm
|
||||||
|
npm run preview
|
||||||
|
|
||||||
|
# pnpm
|
||||||
|
pnpm run preview
|
||||||
|
|
||||||
|
# yarn
|
||||||
|
yarn preview
|
||||||
|
```
|
||||||
|
|
||||||
|
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
|
||||||
|
|||||||
7
app.vue
Normal file
7
app.vue
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<NuxtLayout>
|
||||||
|
<NuxtPage/>
|
||||||
|
</NuxtLayout>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
26
components/FooterBar.vue
Normal file
26
components/FooterBar.vue
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
<script setup>
|
||||||
|
const links = [
|
||||||
|
'Home',
|
||||||
|
'About Us',
|
||||||
|
'Team',
|
||||||
|
'Services',
|
||||||
|
'Blog',
|
||||||
|
'Contact Us',
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<v-footer class="bg-grey-lighten-1">
|
||||||
|
<v-row justify="center" no-gutters>
|
||||||
|
<v-btn
|
||||||
|
v-for="link in links"
|
||||||
|
:key="link"
|
||||||
|
color="white"
|
||||||
|
variant="text"
|
||||||
|
class="mx-2"
|
||||||
|
rounded="xl"
|
||||||
|
>
|
||||||
|
{{ link }}
|
||||||
|
</v-btn>
|
||||||
|
</v-row>
|
||||||
|
</v-footer>
|
||||||
|
</template>
|
||||||
53
components/NavBar.vue
Normal file
53
components/NavBar.vue
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
<script setup>
|
||||||
|
const drawer = false
|
||||||
|
const items = [
|
||||||
|
{
|
||||||
|
title: 'Foo',
|
||||||
|
value: 'foo',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Bar',
|
||||||
|
value: 'bar',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Fizz',
|
||||||
|
value: 'fizz',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Buzz',
|
||||||
|
value: 'buzz',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- <v-system-bar color="deep-purple darken-3"></v-system-bar> -->
|
||||||
|
|
||||||
|
<v-app-bar
|
||||||
|
color="primary"
|
||||||
|
prominent
|
||||||
|
>
|
||||||
|
<v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
|
||||||
|
|
||||||
|
<v-toolbar-title>My files</v-toolbar-title>
|
||||||
|
|
||||||
|
<v-spacer></v-spacer>
|
||||||
|
|
||||||
|
<v-btn variant="text" icon="mdi-magnify"></v-btn>
|
||||||
|
|
||||||
|
<v-btn variant="text" icon="mdi-filter"></v-btn>
|
||||||
|
|
||||||
|
<v-btn variant="text" icon="mdi-dots-vertical"></v-btn>
|
||||||
|
</v-app-bar>
|
||||||
|
|
||||||
|
<v-navigation-drawer
|
||||||
|
v-model="drawer"
|
||||||
|
location="bottom"
|
||||||
|
temporary
|
||||||
|
>
|
||||||
|
<v-list
|
||||||
|
:items="items"
|
||||||
|
></v-list>
|
||||||
|
</v-navigation-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
0
layouts/default.spec.ts
Normal file
0
layouts/default.spec.ts
Normal file
31
layouts/default.vue
Normal file
31
layouts/default.vue
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<script setup>
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<v-card>
|
||||||
|
<v-layout>
|
||||||
|
<div class="main-navigation">
|
||||||
|
<NavBar />
|
||||||
|
</div>
|
||||||
|
<v-main>
|
||||||
|
<slot />
|
||||||
|
</v-main>
|
||||||
|
|
||||||
|
<div id="overlay" />
|
||||||
|
<!-- client-only modal -->
|
||||||
|
<!-- chat -->
|
||||||
|
<v-app-bar
|
||||||
|
color="grey-lighten-2"
|
||||||
|
flat
|
||||||
|
height="48"
|
||||||
|
location="bottom"
|
||||||
|
>
|
||||||
|
<FooterBar />
|
||||||
|
</v-app-bar>
|
||||||
|
|
||||||
|
</v-layout>
|
||||||
|
</v-card>
|
||||||
|
</template>
|
||||||
153
nuxt.config.ts
Normal file
153
nuxt.config.ts
Normal file
@ -0,0 +1,153 @@
|
|||||||
|
// https://nuxt.com/docs/api/configuration/nuxt-config
|
||||||
|
export default defineNuxtConfig({
|
||||||
|
// runtimeConfig: {
|
||||||
|
// // public: {
|
||||||
|
// // GQL_HOST: 'https://api.spacex.land/graphql' // overwritten by process.env.GQL_HOST
|
||||||
|
// // }
|
||||||
|
// },
|
||||||
|
ssr: false,
|
||||||
|
devtools: { enabled: true },
|
||||||
|
modules: [
|
||||||
|
// '@nuxtjs/tailwindcss',
|
||||||
|
'@invictus.codes/nuxt-vuetify',
|
||||||
|
'@nuxtjs/i18n',
|
||||||
|
// '@nuxtjs/apollo',
|
||||||
|
'nuxt-icon',
|
||||||
|
// '@nuxt/image',
|
||||||
|
'@vite-pwa/nuxt',
|
||||||
|
'vue-email/nuxt',
|
||||||
|
'nuxt-mapbox',
|
||||||
|
'@dargmuesli/nuxt-cookie-control',
|
||||||
|
'nuxt-time',
|
||||||
|
// '@nuxtjs/eslint-module', // ESLintConfig
|
||||||
|
'nuxt-graphql-client',
|
||||||
|
],
|
||||||
|
// apollo: {
|
||||||
|
// clients: {
|
||||||
|
// default: {
|
||||||
|
// httpEndpoint: 'https://api.spacex.land/graphql'
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// cookieControl: {
|
||||||
|
// // typed module options
|
||||||
|
// // Position of cookie bar.
|
||||||
|
// // 'top-left', 'top-right', 'top-full', 'bottom-left', 'bottom-right', 'bottom-full'
|
||||||
|
// barPosition: 'bottom-full',
|
||||||
|
|
||||||
|
// // Switch to toggle if clicking the overlay outside the configuration modal closes the modal.
|
||||||
|
// closeModalOnClickOutside: true,
|
||||||
|
|
||||||
|
// // Component colors.
|
||||||
|
// // If you want to disable colors set colors property to false.
|
||||||
|
// colors: {
|
||||||
|
// barBackground: '#000',
|
||||||
|
// barButtonBackground: '#fff',
|
||||||
|
// barButtonColor: '#000',
|
||||||
|
// barButtonHoverBackground: '#333',
|
||||||
|
// barButtonHoverColor: '#fff',
|
||||||
|
// barTextColor: '#fff',
|
||||||
|
// checkboxActiveBackground: '#000',
|
||||||
|
// checkboxActiveCircleBackground: '#fff',
|
||||||
|
// checkboxDisabledBackground: '#ddd',
|
||||||
|
// checkboxDisabledCircleBackground: '#fff',
|
||||||
|
// checkboxInactiveBackground: '#000',
|
||||||
|
// checkboxInactiveCircleBackground: '#fff',
|
||||||
|
// controlButtonBackground: '#fff',
|
||||||
|
// controlButtonHoverBackground: '#000',
|
||||||
|
// controlButtonIconColor: '#000',
|
||||||
|
// controlButtonIconHoverColor: '#fff',
|
||||||
|
// focusRingColor: '#808080',
|
||||||
|
// modalBackground: '#fff',
|
||||||
|
// modalButtonBackground: '#000',
|
||||||
|
// modalButtonColor: '#fff',
|
||||||
|
// modalButtonHoverBackground: '#333',
|
||||||
|
// modalButtonHoverColor: '#fff',
|
||||||
|
// modalOverlay: '#000',
|
||||||
|
// modalOverlayOpacity: 0.8,
|
||||||
|
// modalTextColor: '#000',
|
||||||
|
// modalUnsavedColor: '#fff',
|
||||||
|
// },
|
||||||
|
|
||||||
|
// // The cookies that are to be controlled.
|
||||||
|
// // See detailed explanation further down below!
|
||||||
|
// cookies: {
|
||||||
|
// necessary: [],
|
||||||
|
// optional: [],
|
||||||
|
// },
|
||||||
|
|
||||||
|
// // The milliseconds from now until expiry of the cookies that are being set by this module.
|
||||||
|
// cookieExpiryOffsetMs: 1000 * 60 * 60 * 24 * 365, // one year
|
||||||
|
|
||||||
|
// // Names for the cookies that are being set by this module.
|
||||||
|
// cookieNameIsConsentGiven: 'ncc_c',
|
||||||
|
// cookieNameCookiesEnabledIds: 'ncc_e',
|
||||||
|
|
||||||
|
// // Options to pass to nuxt's useCookie
|
||||||
|
// cookieOptions: {
|
||||||
|
// path: '/',
|
||||||
|
// },
|
||||||
|
|
||||||
|
// // Switch to toggle the "accept necessary" button.
|
||||||
|
// isAcceptNecessaryButtonEnabled: true,
|
||||||
|
|
||||||
|
// // Switch to toggle the button that opens the configuration modal.
|
||||||
|
// isControlButtonEnabled: true,
|
||||||
|
|
||||||
|
// // Switch to toggle the concatenation of target cookie ids to the cookie description.
|
||||||
|
// isCookieIdVisible: false,
|
||||||
|
|
||||||
|
// // Switch to toggle the inclusion of this module's css.
|
||||||
|
// // If css is set to false, you will still be able to access your color variables.
|
||||||
|
// isCssEnabled: true,
|
||||||
|
|
||||||
|
// // Switch to toggle the css variables ponyfill.
|
||||||
|
// isCssPonyfillEnabled: false,
|
||||||
|
|
||||||
|
// // Switch to toggle the separation of cookie name and description in the configuration modal by a dash.
|
||||||
|
// isDashInDescriptionEnabled: true,
|
||||||
|
|
||||||
|
// // Switch to toggle the blocking of iframes.
|
||||||
|
// // This can be used to prevent iframes from adding additional cookies.
|
||||||
|
// isIframeBlocked: false,
|
||||||
|
|
||||||
|
// // Switch to toggle the modal being shown right away, requiring a user's decision.
|
||||||
|
// isModalForced: false,
|
||||||
|
|
||||||
|
// // The locales to include.
|
||||||
|
// locales: ['en'],
|
||||||
|
|
||||||
|
// // Translations to override.
|
||||||
|
// localeTexts: {
|
||||||
|
// en: {
|
||||||
|
// save: 'Remember',
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// eslint: {
|
||||||
|
// /* module options */
|
||||||
|
// },
|
||||||
|
// mapbox: {
|
||||||
|
// accessToken: '{API_KEY}'
|
||||||
|
// },
|
||||||
|
// pwa: {
|
||||||
|
// /* PWA options */
|
||||||
|
// },
|
||||||
|
// vuetify: {
|
||||||
|
// /* vuetify options */
|
||||||
|
// // vuetifyOptions: {
|
||||||
|
// // // @TODO: list all vuetify options
|
||||||
|
// // },
|
||||||
|
|
||||||
|
// moduleOptions: {
|
||||||
|
// /* nuxt-vuetify module options */
|
||||||
|
// treeshaking: true,
|
||||||
|
// useIconCDN: false,
|
||||||
|
|
||||||
|
// /* vite-plugin-vuetify options */
|
||||||
|
// styles: 'sass',
|
||||||
|
// autoImport: true,
|
||||||
|
// useVuetifyLabs: true,
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
})
|
||||||
45
package.json
Normal file
45
package.json
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
{
|
||||||
|
"name": "nuxt-app",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"build": "nuxi build",
|
||||||
|
"dev": "nuxi dev",
|
||||||
|
"generate": "nuxi generate",
|
||||||
|
"preview": "nuxi preview",
|
||||||
|
"postinstall": "nuxi prepare"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@nuxt/devtools": "latest",
|
||||||
|
"@types/jest": "^29.5.3",
|
||||||
|
"@types/node": "^18.17.3",
|
||||||
|
"@vue/test-utils": "^2.4.0-alpha.2",
|
||||||
|
"@vue/vue3-jest": "^29.2.5",
|
||||||
|
"eslint": "^8.47.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@dargmuesli/nuxt-cookie-control": "^6.4.0",
|
||||||
|
"@invictus.codes/nuxt-vuetify": "^0.3.0",
|
||||||
|
"@nuxt/devalue": "^2.0.2",
|
||||||
|
"@nuxt/image": "^0.7.1",
|
||||||
|
"@nuxt/kit": "^3.5.5",
|
||||||
|
"@nuxtjs/eslint-module": "^4.1.0",
|
||||||
|
"@nuxtjs/i18n": "npm:@nuxtjs/i18n-edge",
|
||||||
|
"@pinia/nuxt": "^0.4.11",
|
||||||
|
"@vite-pwa/nuxt": "^0.1.0",
|
||||||
|
"graphql": "^16.0.0",
|
||||||
|
"graphql-tag": "^2.0.0",
|
||||||
|
"nuxt": "^3.6.5",
|
||||||
|
"nuxt-graphql-client": "^0.2.30",
|
||||||
|
"nuxt-icon": "^0.5.0",
|
||||||
|
"nuxt-mapbox": "^1.4.3",
|
||||||
|
"nuxt-time": "^0.1.1",
|
||||||
|
"sass": "^1.66.1",
|
||||||
|
"vite": "^4.4.9",
|
||||||
|
"vite-plugin-pwa": ">=0.16.3 <1",
|
||||||
|
"vue": "^3.3.4",
|
||||||
|
"vue-email": "^0.6.6",
|
||||||
|
"webpack": "^5.88.2",
|
||||||
|
"workbox-build": "^7.0.0",
|
||||||
|
"workbox-window": "^7.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
3
pages/index.vue
Normal file
3
pages/index.vue
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<template>
|
||||||
|
<h1>Index page</h1>
|
||||||
|
</template>
|
||||||
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
3
server/tsconfig.json
Normal file
3
server/tsconfig.json
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"extends": "../.nuxt/tsconfig.server.json"
|
||||||
|
}
|
||||||
4
tsconfig.json
Normal file
4
tsconfig.json
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
// https://nuxt.com/docs/guide/concepts/typescript
|
||||||
|
"extends": "./.nuxt/tsconfig.json"
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user