├── README.md ├── asset-management ├── pre-processors │ ├── .gitignore │ ├── README.md │ ├── assets │ │ ├── logo.svg │ │ ├── main.scss │ │ └── variables.scss │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ └── index.vue │ └── static │ │ └── favicon.ico └── webpack-assets │ ├── .gitignore │ ├── README.md │ ├── assets │ ├── fonts │ │ ├── DMSans-Bold.ttf │ │ └── DMSans-Regular.ttf │ ├── logo.svg │ ├── main.css │ ├── mountains-2.jpg │ ├── mountains-3.jpg │ ├── mountains-4.jpg │ └── mountains.jpg │ ├── layouts │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ └── index.vue │ ├── static │ └── favicon.ico │ └── yarn.lock ├── data-fetching ├── async-data-hook │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ ├── index.vue │ │ └── mountains │ │ │ └── _slug.vue │ └── static │ │ └── favicon.ico └── fetch-hook │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── components │ └── Mountains.vue │ ├── layouts │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ ├── index.vue │ └── mountains │ │ └── _slug.vue │ ├── static │ └── favicon.ico │ └── yarn.lock ├── loading ├── custom-loading-component │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── components │ │ └── LoadingBar.vue │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ ├── index.vue │ │ └── loading.vue │ ├── static │ │ └── favicon.ico │ └── yarn.lock ├── customize-loading-indicator │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ └── index.vue │ ├── static │ │ └── favicon.ico │ └── yarn.lock └── customize-nuxt-loading │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── layouts │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ ├── index.vue │ └── loading.vue │ ├── static │ └── favicon.ico │ └── yarn.lock ├── middleware ├── anonymous-middleware │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── package.json │ ├── pages │ │ ├── anonymous-middleware.vue │ │ └── index.vue │ ├── static │ │ └── favicon.ico │ └── store │ │ └── analytics.js ├── named-middleware │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── middleware │ │ └── auth.js │ ├── package.json │ ├── pages │ │ ├── auth.vue │ │ ├── index.vue │ │ └── named-middleware.vue │ ├── static │ │ └── favicon.ico │ └── store │ │ └── auth.js └── router-middleware │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── layouts │ └── default.vue │ ├── middleware │ └── class.js │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ ├── index.vue │ └── router-middleware.vue │ ├── static │ └── favicon.ico │ └── store │ └── class.js ├── miscellaneous ├── layouts │ ├── .gitignore │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ ├── auth.vue │ │ ├── default.vue │ │ └── profile.vue │ ├── package.json │ ├── pages │ │ ├── index.vue │ │ ├── login.vue │ │ └── profile.vue │ ├── static │ │ └── favicon.ico │ └── yarn.lock ├── lazy-loading-components │ ├── .gitignore │ ├── README.md │ ├── assets │ │ ├── logo.svg │ │ └── main.css │ ├── components │ │ └── MountainsList.vue │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ └── index.vue │ └── static │ │ └── favicon.ico ├── nuxt-helpers │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ └── index.vue │ ├── plugins │ │ └── nuxt-ready.client.js │ └── static │ │ └── favicon.ico └── vuex-store │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── layouts │ └── default.vue │ ├── package.json │ ├── pages │ └── index.vue │ ├── static │ └── favicon.ico │ └── store │ └── todos.js ├── modules ├── axios-usage │ ├── .gitignore │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ └── index.vue │ ├── static │ │ └── favicon.ico │ └── yarn.lock └── local-module │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── layouts │ └── default.vue │ ├── modules │ └── ngrok │ │ └── index.js │ ├── nuxt.config.js │ ├── package.json │ └── pages │ └── index.vue ├── plugins ├── client-only-plugins │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ └── index.vue │ ├── plugins │ │ └── client-only.client.js │ └── static │ │ └── favicon.ico ├── custom-plugins │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ ├── api-plugin.vue │ │ └── index.vue │ ├── plugins │ │ ├── hello.js │ │ └── nuxt-api.js │ ├── static │ │ └── favicon.ico │ ├── store │ │ └── index.js │ └── yarn.lock ├── external-packages-plugin │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ ├── 404.vue │ │ ├── index.vue │ │ └── mountains │ │ │ └── _slug.vue │ ├── plugins │ │ └── axios.js │ ├── static │ │ └── favicon.ico │ └── yarn.lock └── vue-plugins │ ├── .gitignore │ ├── README.md │ ├── assets │ ├── logo.svg │ └── tooltip.css │ ├── layouts │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ └── index.vue │ ├── plugins │ └── vue-tooltip.js │ └── static │ └── favicon.ico ├── routing ├── active-link-classes │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── package.json │ ├── pages │ │ ├── about.vue │ │ └── index.vue │ ├── static │ │ └── favicon.ico │ └── yarn.lock ├── dynamic-pages │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── package.json │ ├── pages │ │ ├── _continent │ │ │ └── _mountain.vue │ │ ├── _slug.vue │ │ └── index.vue │ ├── static │ │ └── favicon.ico │ └── yarn.lock ├── hello-world │ ├── .gitignore │ ├── README.md │ ├── package.json │ ├── pages │ │ ├── about.vue │ │ └── index.vue │ └── yarn.lock └── nested-pages │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── layouts │ └── default.vue │ ├── package.json │ ├── pages │ ├── index.vue │ ├── parent.vue │ └── parent │ │ ├── child.vue │ │ ├── child2.vue │ │ └── index.vue │ └── static │ └── favicon.ico ├── seo ├── seo-html-head │ ├── .gitignore │ ├── README.md │ ├── assets │ │ └── logo.svg │ ├── layouts │ │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ │ ├── about.vue │ │ └── index.vue │ └── static │ │ └── favicon.ico └── seo-twitter-og │ ├── .gitignore │ ├── README.md │ ├── assets │ └── logo.svg │ ├── components │ └── SocialHead.vue │ ├── layouts │ └── default.vue │ ├── nuxt.config.js │ ├── package.json │ ├── pages │ ├── about.vue │ ├── index.vue │ └── mountains │ │ └── _slug.vue │ ├── static │ ├── favicon.ico │ └── nuxt-card.png │ └── yarn.lock └── transitions └── nuxt-transitions ├── .gitignore ├── README.md ├── assets └── logo.svg ├── layouts └── default.vue ├── package.json ├── pages ├── bounce.vue ├── fade.vue ├── index.vue └── slide.vue ├── static └── favicon.ico └── yarn.lock /README.md: -------------------------------------------------------------------------------- 1 | # Nuxt 2 examples 2 | 3 | Examples book for Nuxt 2 4 | -------------------------------------------------------------------------------- /asset-management/pre-processors/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /asset-management/pre-processors/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Configuration Pre-processors](https://nuxtjs.org/docs/2.x/features/configuration) -------------------------------------------------------------------------------- /asset-management/pre-processors/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /asset-management/pre-processors/assets/main.scss: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, 3 | Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, 4 | Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; 5 | margin: 0; 6 | overflow-x: hidden; 7 | overflow-y: scroll; 8 | } 9 | 10 | main { 11 | margin: 0 auto; 12 | margin-top: 25vh; 13 | margin-bottom: 2rem; 14 | padding: 0 1rem; 15 | max-width: 1280px; 16 | text-align: center; 17 | } 18 | 19 | h1 { 20 | color: $secondary; 21 | } 22 | -------------------------------------------------------------------------------- /asset-management/pre-processors/assets/variables.scss: -------------------------------------------------------------------------------- 1 | $primary: orangered; 2 | $secondary: dodgerblue; -------------------------------------------------------------------------------- /asset-management/pre-processors/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /asset-management/pre-processors/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Global CSS - https://nuxtjs.org/docs/2.x/features/configuration#pre-processors 4 | */ 5 | css: ['~/assets/main.scss'], 6 | /* 7 | ** Global style resources - https://www.npmjs.com/package/@nuxtjs/style-resources 8 | */ 9 | styleResources: { 10 | scss: ['~/assets/variables.scss'] 11 | }, 12 | 13 | /* 14 | ** Modules - https://nuxtjs.org/docs/2.x/directory-structure/modules 15 | */ 16 | 17 | modules: ['@nuxtjs/style-resources'] 18 | } 19 | -------------------------------------------------------------------------------- /asset-management/pre-processors/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | }, 12 | "devDependencies": { 13 | "@nuxtjs/style-resources": "^1.0.0", 14 | "pug": "^2.0.4", 15 | "pug-plain-loader": "^1.0.0", 16 | "fibers": "^5.0.0", 17 | "sass": "^1.29.0", 18 | "sass-loader": "^10.1.0" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /asset-management/pre-processors/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 14 | -------------------------------------------------------------------------------- /asset-management/pre-processors/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/pre-processors/static/favicon.ico -------------------------------------------------------------------------------- /asset-management/webpack-assets/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /asset-management/webpack-assets/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Views](https://nuxtjs.org/docs/2.x/directory-structure/assets) -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/fonts/DMSans-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/assets/fonts/DMSans-Bold.ttf -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/fonts/DMSans-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/assets/fonts/DMSans-Regular.ttf -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/main.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'DM Sans'; 3 | font-style: normal; 4 | font-weight: 400; 5 | font-display: swap; 6 | src: url('~assets/fonts/DMSans-Regular.ttf') format('truetype'); 7 | } 8 | 9 | @font-face { 10 | font-family: 'DM Sans'; 11 | font-style: normal; 12 | font-weight: 700; 13 | font-display: swap; 14 | src: url('~assets/fonts/DMSans-Bold.ttf') format('truetype'); 15 | } 16 | 17 | body { 18 | font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, 19 | Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, 20 | Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; 21 | margin: 0; 22 | overflow-x: hidden; 23 | overflow-y: scroll; 24 | } 25 | 26 | main { 27 | margin: 0 auto; 28 | padding: 0 1rem; 29 | max-width: 1280px; 30 | text-align: center; 31 | } 32 | -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/mountains-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/assets/mountains-2.jpg -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/mountains-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/assets/mountains-3.jpg -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/mountains-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/assets/mountains-4.jpg -------------------------------------------------------------------------------- /asset-management/webpack-assets/assets/mountains.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/assets/mountains.jpg -------------------------------------------------------------------------------- /asset-management/webpack-assets/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /asset-management/webpack-assets/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Global CSS - https://nuxtjs.org/docs/2.x/features/configuration#pre-processors 4 | */ 5 | css: ['~/assets/main.css'] 6 | } 7 | -------------------------------------------------------------------------------- /asset-management/webpack-assets/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /asset-management/webpack-assets/pages/index.vue: -------------------------------------------------------------------------------- 1 | 27 | 28 | 37 | 38 | 63 | -------------------------------------------------------------------------------- /asset-management/webpack-assets/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/asset-management/webpack-assets/static/favicon.ico -------------------------------------------------------------------------------- /data-fetching/async-data-hook/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /data-fetching/async-data-hook/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Data Fetching](https://nuxtjs.org/docs/2.x/features/data-fetching) -------------------------------------------------------------------------------- /data-fetching/async-data-hook/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /data-fetching/async-data-hook/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 8 | 83 | -------------------------------------------------------------------------------- /data-fetching/async-data-hook/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Modules - https://nuxtjs.org/docs/2.x/directory-structure/modules 4 | */ 5 | modules: ['@nuxt/http'] 6 | } 7 | -------------------------------------------------------------------------------- /data-fetching/async-data-hook/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "@nuxt/http": "^0.5.1", 11 | "nuxt": "^2.14.5" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /data-fetching/async-data-hook/pages/index.vue: -------------------------------------------------------------------------------- 1 | 16 | 24 | -------------------------------------------------------------------------------- /data-fetching/async-data-hook/pages/mountains/_slug.vue: -------------------------------------------------------------------------------- 1 | 11 | 26 | 38 | -------------------------------------------------------------------------------- /data-fetching/async-data-hook/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/data-fetching/async-data-hook/static/favicon.ico -------------------------------------------------------------------------------- /data-fetching/fetch-hook/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /data-fetching/fetch-hook/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Data Fetching](https://nuxtjs.org/docs/2.x/features/data-fetching) -------------------------------------------------------------------------------- /data-fetching/fetch-hook/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/components/Mountains.vue: -------------------------------------------------------------------------------- 1 | 19 | 37 | 59 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 8 | 83 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Activate components - https://nuxtjs.org/docs/2.x/directory-structure/components#components-module 4 | */ 5 | components: true, 6 | /* 7 | ** Modules - https://nuxtjs.org/docs/2.x/directory-structure/modules 8 | */ 9 | modules: ['@nuxt/http'] 10 | } 11 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "@nuxt/http": "^0.5.1", 11 | "nuxt": "^2.14.5" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/pages/index.vue: -------------------------------------------------------------------------------- 1 | 9 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/pages/mountains/_slug.vue: -------------------------------------------------------------------------------- 1 | 15 | 34 | 46 | -------------------------------------------------------------------------------- /data-fetching/fetch-hook/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/data-fetching/fetch-hook/static/favicon.ico -------------------------------------------------------------------------------- /loading/custom-loading-component/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /loading/custom-loading-component/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Loading](https://nuxtjs.org/docs/2.x/features/loading) -------------------------------------------------------------------------------- /loading/custom-loading-component/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /loading/custom-loading-component/components/LoadingBar.vue: -------------------------------------------------------------------------------- 1 | 6 | 21 | 51 | -------------------------------------------------------------------------------- /loading/custom-loading-component/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 69 | -------------------------------------------------------------------------------- /loading/custom-loading-component/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Activate components - https://nuxtjs.org/docs/2.x/directory-structure/components#components-module 4 | */ 5 | components: true, 6 | 7 | /* 8 | ** importing a custom loader. this will overwrite the default loader 9 | */ 10 | loading: '~/components/LoadingBar.vue' 11 | } 12 | -------------------------------------------------------------------------------- /loading/custom-loading-component/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /loading/custom-loading-component/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /loading/custom-loading-component/pages/loading.vue: -------------------------------------------------------------------------------- 1 | 6 | 19 | -------------------------------------------------------------------------------- /loading/custom-loading-component/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/loading/custom-loading-component/static/favicon.ico -------------------------------------------------------------------------------- /loading/customize-loading-indicator/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /loading/customize-loading-indicator/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Loading](https://nuxtjs.org/docs/2.x/features/loading) -------------------------------------------------------------------------------- /loading/customize-loading-indicator/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /loading/customize-loading-indicator/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 30 | -------------------------------------------------------------------------------- /loading/customize-loading-indicator/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Set ssr to false to see the loading indicator - https://nuxtjs.org/docs/2.x/features/rendering-modes 4 | */ 5 | ssr: false, 6 | 7 | /* 8 | ** modifying the loading indicator for spa - https://nuxtjs.org/docs/2.x/features/loading 9 | */ 10 | loadingIndicator: { 11 | name: 'chasing-dots', 12 | color: 'purple', 13 | background: 'green' 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /loading/customize-loading-indicator/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /loading/customize-loading-indicator/pages/index.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /loading/customize-loading-indicator/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/loading/customize-loading-indicator/static/favicon.ico -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Loading](https://nuxtjs.org/docs/2.x/features/loading) -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 69 | -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** modifying the default loader 4 | */ 5 | loading: { 6 | color: 'DodgerBlue', 7 | height: '10px', 8 | continuous: true, 9 | duration: 3000 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/pages/loading.vue: -------------------------------------------------------------------------------- 1 | 6 | 19 | -------------------------------------------------------------------------------- /loading/customize-nuxt-loading/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/loading/customize-nuxt-loading/static/favicon.ico -------------------------------------------------------------------------------- /middleware/anonymous-middleware/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /middleware/anonymous-middleware/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Anonymous Middleware](https://nuxtjs.org/docs/2.x/directory-structure/middleware#anonymous-middleware) -------------------------------------------------------------------------------- /middleware/anonymous-middleware/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /middleware/anonymous-middleware/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 73 | -------------------------------------------------------------------------------- /middleware/anonymous-middleware/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /middleware/anonymous-middleware/pages/anonymous-middleware.vue: -------------------------------------------------------------------------------- 1 | 7 | 14 | -------------------------------------------------------------------------------- /middleware/anonymous-middleware/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /middleware/anonymous-middleware/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/middleware/anonymous-middleware/static/favicon.ico -------------------------------------------------------------------------------- /middleware/anonymous-middleware/store/analytics.js: -------------------------------------------------------------------------------- 1 | export const state = () => ({ 2 | pageVisits: 0 3 | }) 4 | 5 | export const mutations = { 6 | increment (state) { 7 | state.pageVisits++ 8 | } 9 | } -------------------------------------------------------------------------------- /middleware/named-middleware/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /middleware/named-middleware/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Named Middleware](https://nuxtjs.org/docs/2.x/directory-structure/middleware#named-middleware) -------------------------------------------------------------------------------- /middleware/named-middleware/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /middleware/named-middleware/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 102 | -------------------------------------------------------------------------------- /middleware/named-middleware/middleware/auth.js: -------------------------------------------------------------------------------- 1 | export default function ({redirect, store}) { 2 | const isAuthenticated = store.state.auth.user ? true : false 3 | if (!isAuthenticated) { 4 | redirect({name: 'auth'}) 5 | } 6 | } -------------------------------------------------------------------------------- /middleware/named-middleware/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /middleware/named-middleware/pages/auth.vue: -------------------------------------------------------------------------------- 1 | 14 | 33 | 39 | -------------------------------------------------------------------------------- /middleware/named-middleware/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /middleware/named-middleware/pages/named-middleware.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 20 | -------------------------------------------------------------------------------- /middleware/named-middleware/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/middleware/named-middleware/static/favicon.ico -------------------------------------------------------------------------------- /middleware/named-middleware/store/auth.js: -------------------------------------------------------------------------------- 1 | export const state = () => ({ 2 | user: null, 3 | pass: null 4 | }) 5 | 6 | export const mutations = { 7 | setUser(state, user) { 8 | state.user = user 9 | }, 10 | setPass(state, user) { 11 | state.user = user 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /middleware/router-middleware/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /middleware/router-middleware/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Router Middleware](https://nuxtjs.org/docs/2.x/directory-structure/middleware#router-middleware) -------------------------------------------------------------------------------- /middleware/router-middleware/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /middleware/router-middleware/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 82 | -------------------------------------------------------------------------------- /middleware/router-middleware/middleware/class.js: -------------------------------------------------------------------------------- 1 | export default function ({ store, route }) { 2 | store.commit('class/SetClass', route.name) 3 | } 4 | -------------------------------------------------------------------------------- /middleware/router-middleware/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Router property - https://nuxtjs.org/docs/2.x/features/file-system-routing#the-router-property 4 | */ 5 | router: { 6 | middleware: ['class'] 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /middleware/router-middleware/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /middleware/router-middleware/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /middleware/router-middleware/pages/router-middleware.vue: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /middleware/router-middleware/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/middleware/router-middleware/static/favicon.ico -------------------------------------------------------------------------------- /middleware/router-middleware/store/class.js: -------------------------------------------------------------------------------- 1 | export const state = () => ({ 2 | bodyClass: '' 3 | }) 4 | 5 | export const mutations = { 6 | SetClass (state, bodyClass) { 7 | state.bodyClass = bodyClass 8 | } 9 | } -------------------------------------------------------------------------------- /miscellaneous/layouts/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /miscellaneous/layouts/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /miscellaneous/layouts/layouts/auth.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /miscellaneous/layouts/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 68 | -------------------------------------------------------------------------------- /miscellaneous/layouts/layouts/profile.vue: -------------------------------------------------------------------------------- 1 | 38 | 39 | 83 | -------------------------------------------------------------------------------- /miscellaneous/layouts/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /miscellaneous/layouts/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /miscellaneous/layouts/pages/login.vue: -------------------------------------------------------------------------------- 1 | 12 | 25 | 86 | -------------------------------------------------------------------------------- /miscellaneous/layouts/pages/profile.vue: -------------------------------------------------------------------------------- 1 | 13 | 18 | 40 | -------------------------------------------------------------------------------- /miscellaneous/layouts/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/miscellaneous/layouts/static/favicon.ico -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Components](https://nuxtjs.org/docs/2.x/directory-structure/components) -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/assets/main.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --primary-color: #00c58e; 3 | } 4 | 5 | body { 6 | font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, 7 | Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, 8 | Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; 9 | margin: 0; 10 | overflow-x: hidden; 11 | overflow-y: scroll; 12 | } 13 | 14 | a, 15 | a:visited { 16 | text-decoration: none; 17 | color: inherit; 18 | } 19 | 20 | a:hover { 21 | color: var(--primary-color); 22 | } 23 | 24 | a.nuxt-link-exact-active { 25 | color: var(--primary-color); 26 | } 27 | 28 | button { 29 | background: var(--primary-color); 30 | padding: 0.75rem 1.5rem; 31 | outline: none; 32 | border-radius: 0.5rem; 33 | font-size: 1rem; 34 | border: none; 35 | cursor: pointer; 36 | color: white; 37 | font-weight: 500; 38 | text-transform: uppercase; 39 | box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); 40 | letter-spacing: 0.5px; 41 | margin: 0 0.5rem; 42 | } 43 | 44 | button:hover { 45 | box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 46 | 0 2px 4px -1px rgba(0, 0, 0, 0.06); 47 | opacity: 0.8; 48 | } 49 | 50 | main { 51 | margin: 0 auto; 52 | margin-top: 25vh; 53 | margin-bottom: 2rem; 54 | padding: 0 1rem; 55 | max-width: 1280px; 56 | text-align: center; 57 | } 58 | 59 | ul{ 60 | list-style-type: none; 61 | padding: 0; 62 | } 63 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/components/MountainsList.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 27 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 57 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Activate components - https://nuxtjs.org/docs/2.x/directory-structure/components#components-module 4 | */ 5 | components: true 6 | } 7 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/pages/index.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 23 | -------------------------------------------------------------------------------- /miscellaneous/lazy-loading-components/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/miscellaneous/lazy-loading-components/static/favicon.ico -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/README.md: -------------------------------------------------------------------------------- 1 | [Concepts Book - Context & Helpers](https://nuxtjs.org/docs/2.x/concepts/context-helpers) -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 62 | -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Plugins - https://nuxtjs.org/docs/2.x/directory-structure/plugins 4 | */ 5 | plugins: ['plugins/nuxt-ready.client.js'] 6 | } 7 | -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt build && export" 8 | }, 9 | "dependencies": { 10 | "@nuxt/http": "^0.5.7", 11 | "nuxt": "^2.14.5" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/pages/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 34 | -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/plugins/nuxt-ready.client.js: -------------------------------------------------------------------------------- 1 | window.onNuxtReady(() => { 2 | console.log('Nuxt is ready and mounted') 3 | }) 4 | -------------------------------------------------------------------------------- /miscellaneous/nuxt-helpers/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/miscellaneous/nuxt-helpers/static/favicon.ico -------------------------------------------------------------------------------- /miscellaneous/vuex-store/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /miscellaneous/vuex-store/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Store](https://nuxtjs.org/docs/2.x/directory-structure/store) -------------------------------------------------------------------------------- /miscellaneous/vuex-store/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /miscellaneous/vuex-store/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 72 | -------------------------------------------------------------------------------- /miscellaneous/vuex-store/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /miscellaneous/vuex-store/pages/index.vue: -------------------------------------------------------------------------------- 1 | 24 | 25 | 48 | 49 | 82 | -------------------------------------------------------------------------------- /miscellaneous/vuex-store/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/miscellaneous/vuex-store/static/favicon.ico -------------------------------------------------------------------------------- /miscellaneous/vuex-store/store/todos.js: -------------------------------------------------------------------------------- 1 | export const state = () => ({ 2 | list: [] 3 | }) 4 | 5 | export const mutations = { 6 | add(state, text) { 7 | state.list.push({ 8 | text, 9 | done: false, 10 | id: Date.now() 11 | }) 12 | }, 13 | remove(state, todo) { 14 | state.list = state.list.filter((item) => item.id !== todo.id) 15 | }, 16 | toggle(state, todo) { 17 | todo.done = !todo.done 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /modules/axios-usage/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /modules/axios-usage/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /modules/axios-usage/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 51 | -------------------------------------------------------------------------------- /modules/axios-usage/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Runtime Config 4 | */ 5 | 6 | publicRuntimeConfig: { 7 | axios: { 8 | baseURL: 'https://api.nuxtjs.dev' 9 | } 10 | }, 11 | 12 | /* 13 | ** Modules - https://nuxtjs.org/docs/2.x/directory-structure/modules 14 | */ 15 | modules: ['@nuxtjs/axios'] 16 | } 17 | -------------------------------------------------------------------------------- /modules/axios-usage/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "@nuxtjs/axios": "^5.10.3", 11 | "nuxt": "^2.14.5" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /modules/axios-usage/pages/index.vue: -------------------------------------------------------------------------------- 1 | 9 | 17 | -------------------------------------------------------------------------------- /modules/axios-usage/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/modules/axios-usage/static/favicon.ico -------------------------------------------------------------------------------- /modules/local-module/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | .env 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /modules/local-module/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Modules](https://nuxtjs.org/docs/2.x/directory-structure/modules) -------------------------------------------------------------------------------- /modules/local-module/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /modules/local-module/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 27 | -------------------------------------------------------------------------------- /modules/local-module/modules/ngrok/index.js: -------------------------------------------------------------------------------- 1 | import chalk from 'chalk' 2 | import ngrok from 'ngrok' 3 | 4 | export default function () { 5 | const { nuxt } = this 6 | 7 | // Don't start NGROK in production mode 8 | // nuxt.options is the nuxt.config.js merged with the default values 9 | if (nuxt.options.dev === false) { 10 | return 11 | } 12 | 13 | // Start NGROK when Nuxt server is listening 14 | let url 15 | 16 | nuxt.hook('listen', async function (server, { port }) { 17 | 18 | const options = nuxt.options.ngrok || {} 19 | 20 | const token = process.env.NGROK_TOKEN || options.authtoken 21 | await ngrok.authtoken(token || '') 22 | 23 | url = await ngrok.connect(port) 24 | 25 | nuxt.options.publicRuntimeConfig.ngrok = { url } 26 | nuxt.options.cli.badgeMessages.push( 27 | `Public URL: ${chalk.underline.yellow(url)}` 28 | ) 29 | }) 30 | 31 | // Disconnect ngrok connection when closing nuxt 32 | nuxt.hook('close', function () { 33 | url && ngrok.disconnect(url) 34 | }) 35 | } 36 | -------------------------------------------------------------------------------- /modules/local-module/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Build Modules - https://nuxtjs.org/docs/2.x/directory-structure/modules 4 | */ 5 | buildModules: ['~/modules/ngrok'] 6 | } 7 | -------------------------------------------------------------------------------- /modules/local-module/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "ngrok": "^3.3.0", 11 | "nuxt": "^2.14.5" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /modules/local-module/pages/index.vue: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Plugins Client](https://nuxtjs.org/docs/2.x/directory-structure/plugins#client-or-server-side-only) -------------------------------------------------------------------------------- /plugins/client-only-plugins/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 30 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Plugins - https://nuxtjs.org/docs/2.x/directory-structure/plugins 4 | */ 5 | plugins: [{ src: '~/plugins/client-only.client.js' }] 6 | } 7 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/plugins/client-only.client.js: -------------------------------------------------------------------------------- 1 | export default () => { 2 | window.alert('I work only on client side') 3 | } 4 | -------------------------------------------------------------------------------- /plugins/client-only-plugins/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/plugins/client-only-plugins/static/favicon.ico -------------------------------------------------------------------------------- /plugins/custom-plugins/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /plugins/custom-plugins/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Plugins Custom Plugins](https://nuxtjs.org/docs/2.x/directory-structure/plugins#inject-in-root--context) -------------------------------------------------------------------------------- /plugins/custom-plugins/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /plugins/custom-plugins/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 83 | -------------------------------------------------------------------------------- /plugins/custom-plugins/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Plugins - https://nuxtjs.org/docs/2.x/directory-structure/plugins 4 | */ 5 | plugins: ['~/plugins/hello.js', '~/plugins/nuxt-api.js'] 6 | } 7 | -------------------------------------------------------------------------------- /plugins/custom-plugins/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /plugins/custom-plugins/pages/api-plugin.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 21 | -------------------------------------------------------------------------------- /plugins/custom-plugins/pages/index.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 35 | -------------------------------------------------------------------------------- /plugins/custom-plugins/plugins/hello.js: -------------------------------------------------------------------------------- 1 | export default ({ app }, inject) => { 2 | inject('hello', (msg) => console.log(`Hello ${msg}!`)) 3 | } 4 | -------------------------------------------------------------------------------- /plugins/custom-plugins/plugins/nuxt-api.js: -------------------------------------------------------------------------------- 1 | export default ({ app }, inject) => { 2 | const nuxtApi = async function(path){ 3 | return await fetch('https://api.nuxtjs.dev/' + path).then(res => res.json()) 4 | } 5 | inject('nuxtApi', nuxtApi) 6 | } -------------------------------------------------------------------------------- /plugins/custom-plugins/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/plugins/custom-plugins/static/favicon.ico -------------------------------------------------------------------------------- /plugins/custom-plugins/store/index.js: -------------------------------------------------------------------------------- 1 | export const state = () => ({ 2 | helloMsg: '' 3 | }) 4 | 5 | export const mutations = { 6 | changeHelloValue(state, newValue) { 7 | this.$hello(newValue) 8 | state.helloMsg = newValue 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /plugins/external-packages-plugin/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Plugins External](https://nuxtjs.org/docs/2.x/directory-structure/plugins#external-packages) -------------------------------------------------------------------------------- /plugins/external-packages-plugin/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 51 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Plugins - https://nuxtjs.org/docs/2.x/directory-structure/plugins 4 | */ 5 | plugins: ['~/plugins/axios.js'], 6 | 7 | /* 8 | ** Modules - https://nuxtjs.org/docs/2.x/directory-structure/modules 9 | */ 10 | modules: ['@nuxtjs/axios'] 11 | } 12 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "@nuxtjs/axios": "^5.10.3", 11 | "nuxt": "^2.14.5" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/pages/404.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/pages/index.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 25 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/pages/mountains/_slug.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 19 | 25 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/plugins/axios.js: -------------------------------------------------------------------------------- 1 | export default function ({ $axios, redirect }) { 2 | $axios.onError((error) => { 3 | if (error.response.status === 404) { 4 | redirect('/404/') 5 | } 6 | }) 7 | } 8 | -------------------------------------------------------------------------------- /plugins/external-packages-plugin/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/plugins/external-packages-plugin/static/favicon.ico -------------------------------------------------------------------------------- /plugins/vue-plugins/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /plugins/vue-plugins/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Plugins Vue](https://nuxtjs.org/docs/2.x/directory-structure/plugins#vue-plugins) -------------------------------------------------------------------------------- /plugins/vue-plugins/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /plugins/vue-plugins/assets/tooltip.css: -------------------------------------------------------------------------------- 1 | .tooltip { 2 | display: block !important; 3 | z-index: 10000; 4 | } 5 | .tooltip .tooltip-inner { 6 | background: black; 7 | color: white; 8 | border-radius: 16px; 9 | padding: 5px 10px 4px; 10 | } 11 | .tooltip .tooltip-arrow { 12 | width: 0; 13 | height: 0; 14 | border-style: solid; 15 | position: absolute; 16 | margin: 5px; 17 | border-color: black; 18 | } 19 | .tooltip[x-placement^='top'] { 20 | margin-bottom: 5px; 21 | } 22 | .tooltip[x-placement^='top'] .tooltip-arrow { 23 | border-width: 5px 5px 0 5px; 24 | border-left-color: transparent !important; 25 | border-right-color: transparent !important; 26 | border-bottom-color: transparent !important; 27 | bottom: -5px; 28 | left: calc(50% - 5px); 29 | margin-top: 0; 30 | margin-bottom: 0; 31 | } 32 | .tooltip[x-placement^='bottom'] { 33 | margin-top: 5px; 34 | } 35 | .tooltip[x-placement^='bottom'] .tooltip-arrow { 36 | border-width: 0 5px 5px 5px; 37 | border-left-color: transparent !important; 38 | border-right-color: transparent !important; 39 | border-top-color: transparent !important; 40 | top: -5px; 41 | left: calc(50% - 5px); 42 | margin-top: 0; 43 | margin-bottom: 0; 44 | } 45 | .tooltip[x-placement^='right'] { 46 | margin-left: 5px; 47 | } 48 | .tooltip[x-placement^='right'] .tooltip-arrow { 49 | border-width: 5px 5px 5px 0; 50 | border-left-color: transparent !important; 51 | border-top-color: transparent !important; 52 | border-bottom-color: transparent !important; 53 | left: -5px; 54 | top: calc(50% - 5px); 55 | margin-left: 0; 56 | margin-right: 0; 57 | } 58 | .tooltip[x-placement^='left'] { 59 | margin-right: 5px; 60 | } 61 | .tooltip[x-placement^='left'] .tooltip-arrow { 62 | border-width: 5px 0 5px 5px; 63 | border-top-color: transparent !important; 64 | border-right-color: transparent !important; 65 | border-bottom-color: transparent !important; 66 | right: -5px; 67 | top: calc(50% - 5px); 68 | margin-left: 0; 69 | margin-right: 0; 70 | } 71 | .tooltip[aria-hidden='true'] { 72 | visibility: hidden; 73 | opacity: 0; 74 | transition: opacity 0.15s, visibility 0.15s; 75 | } 76 | .tooltip[aria-hidden='false'] { 77 | visibility: visible; 78 | opacity: 1; 79 | transition: opacity 0.15s; 80 | } 81 | -------------------------------------------------------------------------------- /plugins/vue-plugins/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 74 | -------------------------------------------------------------------------------- /plugins/vue-plugins/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Global CSS - https://nuxtjs.org/docs/2.x/features/configuration#pre-processors 4 | */ 5 | css: ['~/assets/tooltip.css'], 6 | 7 | /* 8 | ** Plugins - https://nuxtjs.org/docs/2.x/directory-structure/plugins 9 | */ 10 | plugins: ['~/plugins/vue-tooltip.js'] 11 | } 12 | -------------------------------------------------------------------------------- /plugins/vue-plugins/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5", 11 | "v-tooltip": "^2.0.3" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /plugins/vue-plugins/pages/index.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /plugins/vue-plugins/plugins/vue-tooltip.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VTooltip from 'v-tooltip' 3 | 4 | Vue.use(VTooltip) 5 | -------------------------------------------------------------------------------- /plugins/vue-plugins/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/plugins/vue-plugins/static/favicon.ico -------------------------------------------------------------------------------- /routing/active-link-classes/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store 4 | dist -------------------------------------------------------------------------------- /routing/active-link-classes/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - NuxtLink Component](https://nuxtjs.org/docs/2.x/features/nuxt-components) -------------------------------------------------------------------------------- /routing/active-link-classes/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /routing/active-link-classes/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 77 | -------------------------------------------------------------------------------- /routing/active-link-classes/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /routing/active-link-classes/pages/about.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /routing/active-link-classes/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /routing/active-link-classes/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/routing/active-link-classes/static/favicon.ico -------------------------------------------------------------------------------- /routing/dynamic-pages/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* 23 | .vscode 24 | -------------------------------------------------------------------------------- /routing/dynamic-pages/README.md: -------------------------------------------------------------------------------- 1 | [Directory Structure Book - Pages](https://nuxtjs.org/docs/2.x/directory-structure/pages) -------------------------------------------------------------------------------- /routing/dynamic-pages/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /routing/dynamic-pages/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 76 | -------------------------------------------------------------------------------- /routing/dynamic-pages/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /routing/dynamic-pages/pages/_continent/_mountain.vue: -------------------------------------------------------------------------------- 1 | 9 | 32 | -------------------------------------------------------------------------------- /routing/dynamic-pages/pages/_slug.vue: -------------------------------------------------------------------------------- 1 | 7 | 15 | -------------------------------------------------------------------------------- /routing/dynamic-pages/pages/index.vue: -------------------------------------------------------------------------------- 1 | 10 | 21 | -------------------------------------------------------------------------------- /routing/dynamic-pages/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/routing/dynamic-pages/static/favicon.ico -------------------------------------------------------------------------------- /routing/hello-world/.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | node_modules 3 | package-lock.json 4 | 5 | # logs 6 | npm-debug.log 7 | yarn-error.log 8 | 9 | # other 10 | .nuxt 11 | dist 12 | .vscode 13 | .idea 14 | newrelic_agent.log 15 | .DS_STORE 16 | .eslintrc 17 | 18 | # docs 19 | /docs 20 | 21 | # @nuxtjs/pwa 22 | sw.* -------------------------------------------------------------------------------- /routing/hello-world/README.md: -------------------------------------------------------------------------------- 1 | [Get Started Book - Installation](https://nuxtjs.org/docs/2.x/get-started/installation) -------------------------------------------------------------------------------- /routing/hello-world/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /routing/hello-world/pages/about.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 28 | -------------------------------------------------------------------------------- /routing/hello-world/pages/index.vue: -------------------------------------------------------------------------------- 1 | 19 | 28 | -------------------------------------------------------------------------------- /routing/nested-pages/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /routing/nested-pages/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Nuxt Components](https://nuxtjs.org/docs/2.x/features/nuxt-components) -------------------------------------------------------------------------------- /routing/nested-pages/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /routing/nested-pages/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 76 | -------------------------------------------------------------------------------- /routing/nested-pages/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /routing/nested-pages/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /routing/nested-pages/pages/parent.vue: -------------------------------------------------------------------------------- 1 | 17 | -------------------------------------------------------------------------------- /routing/nested-pages/pages/parent/child.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /routing/nested-pages/pages/parent/child2.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /routing/nested-pages/pages/parent/index.vue: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /routing/nested-pages/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/routing/nested-pages/static/favicon.ico -------------------------------------------------------------------------------- /seo/seo-html-head/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /seo/seo-html-head/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Meta Tags and SEO](https://nuxtjs.org/docs/2.x/features/meta-tags-seo) -------------------------------------------------------------------------------- /seo/seo-html-head/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /seo/seo-html-head/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 19 | 69 | -------------------------------------------------------------------------------- /seo/seo-html-head/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Head Property - https://nuxtjs.org/docs/2.x/features/meta-tags-seo 4 | */ 5 | head: { 6 | title: 'Nuxt', 7 | titleTemplate: 'My amazing Nuxt application | %s', 8 | htmlAttrs: { 9 | lang: 'en', 10 | amp: true 11 | }, 12 | meta: [ 13 | { charset: 'utf-8' }, 14 | { 15 | name: 'viewport', 16 | content: 'width=device-width, initial-scale=1' 17 | }, 18 | { 19 | hid: 'description', 20 | name: 'description', 21 | content: 22 | 'The amazing Nuxt application that teaches me all the cool features of Nuxt' 23 | } 24 | ], 25 | link: [ 26 | { 27 | rel: 'stylesheet', 28 | href: 'https://fonts.googleapis.com/css?family=Nunito&display=swap' 29 | } 30 | ], 31 | script: [ 32 | { 33 | src: 'https://cdn.jsdelivr.net/npm/vue/dist/vue.js', 34 | async: true, 35 | defer: true 36 | } 37 | ] 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /seo/seo-html-head/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /seo/seo-html-head/pages/about.vue: -------------------------------------------------------------------------------- 1 | 6 | 20 | -------------------------------------------------------------------------------- /seo/seo-html-head/pages/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 29 | 34 | -------------------------------------------------------------------------------- /seo/seo-html-head/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/seo/seo-html-head/static/favicon.ico -------------------------------------------------------------------------------- /seo/seo-twitter-og/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /seo/seo-twitter-og/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Meta Tags and SEO](https://nuxtjs.org/docs/2.x/features/meta-tags-seo) -------------------------------------------------------------------------------- /seo/seo-twitter-og/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/components/SocialHead.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 77 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 18 | 93 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/nuxt.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | /* 3 | ** Head Property - https://nuxtjs.org/docs/2.x/features/meta-tags-seo 4 | */ 5 | head: { 6 | title: 'My amazing Nuxt application', 7 | titleTemplate: 'Nuxt | %s', 8 | meta: [ 9 | { charset: 'utf-8' }, 10 | { 11 | name: 'viewport', 12 | content: 'width=device-width, initial-scale=1' 13 | }, 14 | { 15 | hid: 'description', 16 | name: 'description', 17 | content: 18 | 'The amazing Nuxt application that teaches me all the cool features of Nuxt' 19 | }, 20 | 21 | // Twitter 22 | // Test on: https://cards-dev.twitter.com/validator 23 | { 24 | hid: 'twitter:card', 25 | name: 'twitter:card', 26 | content: 'summary_large_image' 27 | }, 28 | { hid: 'twitter:site', name: 'twitter:site', content: '@nuxt_js' }, 29 | { 30 | hid: 'twitter:url', 31 | name: 'twitter:url', 32 | content: 'https://nuxtjs.org' 33 | }, 34 | { 35 | hid: 'twitter:title', 36 | name: 'twitter:title', 37 | content: 'My amazing Nuxt application' 38 | }, 39 | { 40 | hid: 'twitter:description', 41 | name: 'twitter:description', 42 | content: 43 | 'The amazing Nuxt application that teaches me all the cool features of Nuxt' 44 | }, 45 | { 46 | hid: 'twitter:image', 47 | name: 'twitter:image', 48 | content: 'https://nuxtjs.org/nuxt-card.png' 49 | }, 50 | 51 | // Open Graph 52 | // Test on: https://developers.facebook.com/tools/debug/ 53 | { hid: 'og:site_name', property: 'og:site_name', content: 'Nuxt' }, 54 | { hid: 'og:type', property: 'og:type', content: 'website' }, 55 | { 56 | hid: 'og:url', 57 | property: 'og:url', 58 | content: 'https://nuxtjs.org' 59 | }, 60 | { 61 | hid: 'og:title', 62 | property: 'og:title', 63 | content: 'My amazing Nuxt application' 64 | }, 65 | { 66 | hid: 'og:description', 67 | property: 'og:description', 68 | content: 69 | 'The amazing Nuxt application that teaches me all the cool features of Nuxt' 70 | }, 71 | { 72 | hid: 'og:image', 73 | property: 'og:image', 74 | content: 'https://nuxtjs.org/nuxt-card.png' 75 | }, 76 | { 77 | hid: 'og:image:secure_url', 78 | property: 'og:image:secure_url', 79 | content: 'https://nuxtjs.org/nuxt-card.png' 80 | }, 81 | { 82 | hid: 'og:image:alt', 83 | property: 'og:image:alt', 84 | content: 'NuxtJS' 85 | } 86 | ], 87 | // canonical 88 | link: [ 89 | { 90 | hid: 'canonical', 91 | rel: 'canonical', 92 | href: `https://nuxtjs.org/examples` 93 | } 94 | ] 95 | } 96 | } 97 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/pages/about.vue: -------------------------------------------------------------------------------- 1 | 7 | 21 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/pages/index.vue: -------------------------------------------------------------------------------- 1 | 16 | 44 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/pages/mountains/_slug.vue: -------------------------------------------------------------------------------- 1 | 16 | 42 | 54 | -------------------------------------------------------------------------------- /seo/seo-twitter-og/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/seo/seo-twitter-og/static/favicon.ico -------------------------------------------------------------------------------- /seo/seo-twitter-og/static/nuxt-card.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/seo/seo-twitter-og/static/nuxt-card.png -------------------------------------------------------------------------------- /transitions/nuxt-transitions/.gitignore: -------------------------------------------------------------------------------- 1 | .nuxt/ 2 | node_modules/ 3 | .DS_Store -------------------------------------------------------------------------------- /transitions/nuxt-transitions/README.md: -------------------------------------------------------------------------------- 1 | [Features Book - Transitions](https://nuxtjs.org/docs/2.x/features/transitions) -------------------------------------------------------------------------------- /transitions/nuxt-transitions/assets/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 17 | 121 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-nuxt-project", 3 | "scripts": { 4 | "dev": "nuxt", 5 | "build": "nuxt build", 6 | "start": "nuxt start", 7 | "generate": "nuxt generate" 8 | }, 9 | "dependencies": { 10 | "nuxt": "^2.14.5" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/pages/bounce.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 13 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/pages/fade.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/pages/index.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/pages/slide.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 13 | -------------------------------------------------------------------------------- /transitions/nuxt-transitions/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nuxtlabs/examples/a67179053745c0cfee26df03ca9fad962721683c/transitions/nuxt-transitions/static/favicon.ico --------------------------------------------------------------------------------