feedback2code

[ Install guide ]

Feedback widget for Vue and Nuxt

In Nuxt the widget is one entry in nuxt.config.ts. In a plain Vue app it is one script tag in index.html.

Updated

Before you start

  1. Sign in with GitHub and install the feedback2code GitHub App. Choose the repository that holds the code of the site.
  2. Open the repository in the dashboard, go to Configure and add the domains the widget may run on.
  3. Copy the snippet from Embed Widget. It contains your widget ID.

Add the widget

nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: "https://www.feedback2code.dev/widget/YOUR_WIDGET_ID",
          async: true,
        },
      ],
    },
  },
});

Replace YOUR_WIDGET_ID with the ID from your dashboard. For a Vue app built with Vite, skip the config and add the script tag to index.html before the closing body tag, the same way as for any static page.

What the agent can change

The agent works on the repository of the site: single-file components, pages, layouts, composables and styles.

Every change arrives as a pull request. Nothing is merged or deployed until you do it, so your usual review and deployment stay as they are.

Good to know

  • Add localhost to the authorized domains to try the widget during development.
  • With a Content-Security-Policy, allow https://www.feedback2code.dev in script-src and frame-src.
  • The widget records the address of the page it was loaded on. Client-side navigation does not update it.

Test it

  1. Deploy the change and open the site on an authorized domain.
  2. Click the button at the bottom right and send one small, concrete request.
  3. Open your dashboard. The submission starts as coding and turns to awaiting review once the pull request is open.

What a submission contains and how the plans differ is described on the page about the website feedback widget.

Other setups

Questions and answers

Is there a Nuxt module?

No, and none is needed. The script entry in nuxt.config.ts adds the widget to every page.

Does it work with server-side rendering and static generation?

Yes. The widget loads in the browser after the page is delivered, so the rendering mode does not matter.

Does it work with Vue 2?

Yes. The widget does not depend on Vue. Any version works as long as the script tag is on the page.

[ Try it ]

Feedback in. Pull request out.

Connect a repository, paste one script tag and send your first feedback.

Free plan · No credit card · GitHub login