├── .env.dist ├── .npmrc ├── server └── tsconfig.json ├── public └── favicon.ico ├── tsconfig.json ├── .gitignore ├── plugins └── flare.client.ts ├── nuxt.config.ts ├── package.json ├── app.vue └── README.md /.env.dist: -------------------------------------------------------------------------------- 1 | FLARE_KEY="" 2 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | shamefully-hoist=true 2 | strict-peer-dependencies=false 3 | -------------------------------------------------------------------------------- /server/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../.nuxt/tsconfig.server.json" 3 | } 4 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/spatie/flare-demo-nuxt3/master/public/favicon.ico -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | // https://nuxt.com/docs/guide/concepts/typescript 3 | "extends": "./.nuxt/tsconfig.json" 4 | } 5 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Nuxt dev/build outputs 2 | .output 3 | .data 4 | .nuxt 5 | .nitro 6 | .cache 7 | dist 8 | 9 | # Node dependencies 10 | node_modules 11 | 12 | # Logs 13 | logs 14 | *.log 15 | 16 | # Misc 17 | .DS_Store 18 | .fleet 19 | .idea 20 | 21 | # Local env files 22 | .env 23 | .env.* 24 | !.env.example 25 | -------------------------------------------------------------------------------- /plugins/flare.client.ts: -------------------------------------------------------------------------------- 1 | import { flare } from "@flareapp/flare-client"; 2 | import { flareVue } from "@flareapp/flare-vue"; 3 | 4 | export default defineNuxtPlugin(({ $config, vueApp}) => { 5 | flare.light($config.public.flareKey); 6 | flare.beforeSubmit = (report) => { 7 | return { 8 | ...report, 9 | application_path: report.context.request?.url, 10 | }; 11 | }; 12 | vueApp.use(flareVue); 13 | }); -------------------------------------------------------------------------------- /nuxt.config.ts: -------------------------------------------------------------------------------- 1 | // https://nuxt.com/docs/api/configuration/nuxt-config 2 | import flareSourcemapUploader from '@flareapp/vite-plugin-sourcemap-uploader'; 3 | 4 | export default defineNuxtConfig({ 5 | devtools: { 6 | enabled: true, 7 | }, 8 | 9 | sourcemap: true, 10 | vite: { 11 | plugins: [ 12 | flareSourcemapUploader({ 13 | key: process.env.FLARE_KEY, 14 | }), 15 | ], 16 | }, 17 | 18 | runtimeConfig: { 19 | public: { 20 | flareKey: process.env.FLARE_KEY 21 | } 22 | }, 23 | 24 | modules: ['@nuxtjs/tailwindcss'] 25 | }) -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "flare-demo-nuxt3", 3 | "scripts": { 4 | "build": "nuxt build", 5 | "dev": "nuxt dev", 6 | "generate": "nuxt generate", 7 | "preview": "nuxt preview", 8 | "postinstall": "nuxt prepare" 9 | }, 10 | "devDependencies": { 11 | "@flareapp/vite-plugin-sourcemap-uploader": "^1.0.2", 12 | "@nuxt/devtools": "latest", 13 | "@nuxtjs/tailwindcss": "^6.8.0", 14 | "@types/node": "^18.17.3", 15 | "nuxt": "^3.6.5" 16 | }, 17 | "dependencies": { 18 | "@flareapp/flare-client": "^3.0.5", 19 | "@flareapp/flare-vue": "^3.0.5" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /app.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 34 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # nuxt3 flare demo 2 | A demo project on how to use send nuxt 3 client-side errors to [Flare](https://flareapp.io) 3 | 4 | ## Support us 5 | 6 | [](https://spatie.be/github-ad-click/spatie.be) 7 | 8 | We invest a lot of resources into creating [best in class open source packages](https://spatie.be/open-source). You can support us by [buying one of our paid products](https://spatie.be/open-source/support-us). 9 | 10 | We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on [our contact page](https://spatie.be/about-us). We publish all received postcards on [our virtual postcard wall](https://spatie.be/open-source/postcards). 11 | 12 | 13 | ## Build Setup 14 | ### setup .env 15 | ```bash 16 | cp .env.dist .env 17 | ``` 18 | Now add your flare key to `.env` 19 | 20 | ### install dependencies 21 | ```bash 22 | npm install 23 | ``` 24 | 25 | ### serve with hot reload at localhost:3000 26 | ```bash 27 | npm run dev 28 | ``` 29 | 30 | ### build for production & upload sourcemap 31 | ```bash 32 | npm run build 33 | 34 | # launch server 35 | npm run preview 36 | ``` 37 | 38 | --------------------------------------------------------------------------------