Activities

syffs

syffs posted a new feature request

modules •

idea google-tag-manager consent opt-out

What problem does this feature solve?

I haven't found any related info or guideline, so this could be only documentation related.

This is needed for european gdpr compliance

What does the proposed changes look like?

allow to disable gtm somehow, or disable it by default, and allow to enable it on opt-in

adamkhan

adamkhan posted a new bug report

modules •

bug @nuxtjs/markdownit not parsing HTML tags

Version

1.2.3

Reproduction link

https://codesandbox.io/s/l780y229q7?fontsize=14

Steps to reproduce

Install @nuxtjs/markdownit, follow the instructions to inject text as laid out in its README, and include some HTML in the markdowned text.

What is expected ?

Markdownit will parse HTML.

What is actually happening?

HTML tags are rendered literalIy, at least, the ones I have in my text, namely span and cite.

adamkhan

adamkhan posted a new question

modules •

delete me

delete me

waghcwb

waghcwb posted a new question

modules •

@nuxtjs/google-tag-manager - Add debug option

It would be nice if we have a option to enable/disable the debug mode instead of turning NODE_ENV to production.

BrenoRRodrigues

BrenoRRodrigues posted a new question

modules •

BootstrapVue Don't load

I create project nuxt using bootstrapvue, but when I'm going to use a bootstrap component, it does not recognize and does not show any error messages, just shows the text written inside the component

nuxt.config.js > modules:

modules: [
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
    // Doc: https://bootstrap-vue.js.org/docs/
    'bootstrap-vue/nuxt'
  ],

package.json

"version": "1.0.0",
  "description": "My top-notch Nuxt.js project",
  "author": "Breno R. Rodrigues",
  "private": true,
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate"
  },
  "dependencies": {
    "cross-env": "^5.2.0",
    "nuxt": "^2.4.0",
    "bootstrap-vue": "^2.0.0-rc.11",
    "bootstrap": "^4.1.3",
    "@nuxtjs/axios": "^5.3.6"
  },
  "devDependencies": {
    "nodemon": "^1.18.9"
  }

I make project using Universal option.

When I inspect the page, the bootstrap css tag does not appear.

Anyone have any idea what I can do to fix it?

Thanks

Glutnix

Glutnix posted a new feature request

modules •

idea google-tag-manager does not add noscript to body element.

What problem does this feature solve?

tracking still takes place when page loaded with javascript turned off

What does the proposed changes look like?

Module needs to add this immediately after the <body> open tag

    <!-- Google Tag Manager (noscript) -->
    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-xxxxxxx&gtm_auth=xxxxxxxxxxxx&gtm_preview=xxxx&gtm_cookies_win=x" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
    <!-- End Google Tag Manager (noscript) -->
IlyaShkurenko

IlyaShkurenko posted a new question

modules •

Not sending any requests to api for GTM id from nuxt.config.js
colsen1991

colsen1991 posted a new bug report

modules •

bug Google Tag Manager loading and installing more than once

Reproduction link

https://www.skogfrua.no/

Steps to reproduce

Install Tag Assistant (TA) and visit the reproduction link (it's a live site in Norwegian, but it shouldn't matter for testing). Use TA to view status of containers being loaded. Navigate on the site and watch the number of installations go up, and TA giving a warning of multiple installations being detected. Every other or so page navigations, as well as reloading the site, bumps this number.

single after page load.jpg
multiple after navigating.jpg

What is expected ?

Google Tag Manager should only be loaded and installed once on page load(?), then run as normal on page navigations.

(?)*) This is my first time using GTA, not too sure about the specifics here. But seeing as the site uses nuxt generate, which loads the first proper HTML file, then runs as an SPA, correct?

What is actually happening?

GTM is fetched twice and the is installed several times over on page navigation and page reloads.

Additional comments?

An unrelated(?) issue is network tab showing GTM js being loaded after on page load and first on the first page navigation, but then nothing. Is this intentional and could it be related? However on consecutive page loads after page navigation number 1, it doesn't fetch it any more, but the number of installations keep going up.

My modules config:

[
    '@nuxtjs/pwa',
    '@nuxtjs/sitemap',
    [
      '@nuxtjs/google-analytics',
      {
        ua: 'UA-107229265-6',
        disabled: isDev || isStaging
      }
    ],
    [
      '@nuxtjs/google-tag-manager',
      {
        id: 'GTM-KSHV228',
        disabled: isDev || isStaging
      }
    ],
    [
      'nuxt-facebook-pixel-module',
      {
        pixelId: '327112147918767',
        disabled: isDev || isStaging
      }
    ]
  ]

Using nuxt generate for publishing and nuxt-link for internal navigation.

Side note: adding the generated script tag from Google to app.html head seems to work as expected (tested locally). Of course this would not give me the opportunity to track page views without custom code, but since I'm using GA module, which works fine for page view tracking, is this a good alternative/temp fix?

It should be mentioned that this is my first time ever installing GTM, so I'm not sure what consequences this might have for the site? I did test pageview, link click and history change tag triggers, and all working fine and only firing once.

Any input, insight etc. is greatly appreciated! Cheers!

sowinski

sowinski posted a new question

modules •

Google Analytics not working in GTM container

Hi,

I successfully added Google Tag Manager to my nuxt project. I added Google Analytics into my Google Tag Manager Container and I can see the first loading of the page in Google Analytics.

BUT!
If I click on a router link (To display a new page) This page is not tracked in Google Analytics.
What can I do?

Thank you

furyscript

furyscript posted a new question

modules •

Question about A La Carte of Vuetify

Is it possible to import single components of Vuetify with A La Carte?

Extarys

Extarys posted a new question

modules •

[CLOSED] Vuetify doesn't work with nuxt, relative module not found

Package: https://github.com/nuxt-community/modules/tree/master/packages/vuetify

I did try with plugins before and then vuetify-loader but nothing seems to work.

I had to upgrade the following package as Vuetify was complaining of insufficient version:

"vue-template-compiler": "^2.5.22",
"vue-server-renderer": "^2.5.22",
"vue": "^2.5.22",

The complete error:

 ERROR  Failed to compile with 1 errors                                                friendly-errors 23:00:08

This relative module was not found:                                                    friendly-errors 23:00:08
                                                                                       friendly-errors 23:00:08
* ../../../src/stylus/components/_grid.styl in ./node_modules/vuetify/lib/components/VGrid/VLayout.js
(node:15312) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'loadResources' of undefined
    at Server.loadResources (/media/test/node_modules/@nuxt/server/dist/server.js:653:26)
    at compiler.hooks.done.tap (/media/test/node_modules/@nuxt/webpack/dist/webpack.js:5089:21)
    at <anonymous>
    at process._tickDomainCallback (internal/process/next_tick.js:229:7)
(node:15312) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)

Dependencies:

  "dependencies": {
    "@babel/plugin-transform-runtime": "^7.2.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.12",
    "@fortawesome/pro-light-svg-icons": "^5.6.3",
    "@fortawesome/pro-solid-svg-icons": "^5.6.3",
    "@fortawesome/vue-fontawesome": "^0.1.5",
    "@nuxtjs/auth": "^4.5.3",
    "@nuxtjs/axios": "^5.3.6",
    "@nuxtjs/moment": "^1.1.0",
    "@nuxtjs/proxy": "^1.3.1",
    "@nuxtjs/vuetify": "^0.5.1",
    "babel-eslint": "^10.0.1",
    "cookie": "^0.3.1",
    "countup": "^1.8.2",
    "cross-env": "^5.2.0",
    "howler": "^2.1.1",
    "iltorb": "^2.4.1",
    "iview": "^3.2.2",
    "js-cookie": "^2.2.0",
    "koa": "^2.6.2",
    "koa-subdomain": "^2.4.0",
    "moment": "^2.23.0",
    "nanoid": "^2.0.1",
    "nodemailer": "^5.1.1",
    "nuxt": "^2.3.4",
    "nuxt-i18n": "^5.5.0",
    "paseto.js": "^0.1.3",
    "pg": "^7.8.0",
    "uuid": "^3.3.2",
    "vue": "^2.5.22",
    "vue-echarts": "^3.1.3",
    "vue-howler": "^0.7.0",
    "vue-loader": "^14.2.2"
  },
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.2.3",
    "@babel/traverse": "^7.2.3",
    "@fortawesome/fontawesome-pro": "^5.6.3",
    "babel-plugin-transform-imports": "^1.5.1",
    "css-loader": "^2.1.0",
    "eslint": "^5.12.0",
    "eslint-config-prettier": "^3.1.0",
    "eslint-config-standard": "^12.0.0",
    "eslint-loader": "^2.1.1",
    "eslint-plugin-html": "^5.0.0",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-node": "^8.0.1",
    "eslint-plugin-prettier": "^3.0.0",
    "eslint-plugin-promise": "^4.0.1",
    "eslint-plugin-security": "^1.4.0",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^4.7.1",
    "node-sass": "^4.11.0",
    "nodemon": "^1.18.9",
    "prettier": "1.14.3",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.1",
    "v8-profiler": "^5.7.0",
    "vue-server-renderer": "^2.5.22",
    "vue-style-loader": "^4.1.2",
    "vue-template-compiler": "^2.5.22",
    "vuetify-loader": "^1.1.1",
    "webpack": "^4.28.4",
    "webpack-node-externals": "^1.7.2"
  }

nuxt.config.js
There may be some residual lines from all my tries to make Vuetify works with Nuxt

const pkg = require('./package')
const config = require('./server/config')

// TODO find a way to include colors from vuetify

const nodeExternals = require('webpack-node-externals')

module.exports = {
  mode: 'universal',

  /*
  ** Headers of the page
  */
  head: {
    title: pkg.name,
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: pkg.description }
    ],
    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
  },

  /*
  ** Customize the progress-bar color
  */
  loading: { color: '#00f' },
  /*
  ** Global CSS
  */
  css: [
    // '~/assets/style/app.styl'
    //'@fortawesome/fontawesome-pro/css/all.min.css'
  ],

  /*
  ** Plugins to load before mounting the App
  */
  plugins: [
    // { src: '~plugins/iview', ssr: true },
    // { src: '~/plugins/vuetify.js' },
    { src: '~plugins/echarts', ssr: false },
    { src: '~plugins/fa', ssr: false }
  ],
  /*
  ** Nuxt.js modules
  */
  modules: [
    // Doc: https://github.com/nuxt-community/axios-module#usage
    '@nuxtjs/axios',
    '@nuxtjs/auth',
    '@nuxtjs/vuetify',
    ['@nuxtjs/moment', { locales: ['en-gb', 'fr-ca'], plugin: true }][
      ('nuxt-i18n',
      {
        seo: true,
        detectBrowserLanguage: true,
        locales: [
          {
            code: 'en',
            iso: 'en-US'
          },
          {
            code: 'es',
            iso: 'es-ES'
          },
          {
            code: 'fr',
            iso: 'fr-FR'
          }
        ],
        defaultLocale: 'en',
        parsePages: false, // Disable acorn parsing
      })
    ]
  ],
  /*
  ** Axios module configuration
  */
  axios: {
    // See https://github.com/nuxt-community/axios-module#options
    // proxy: true,
    debug: false
  },

  vuetify: {
    materialIcons: false,
    theme: {
      primary: '#0277bd',
      secondary: '#546e7a',
      accent: '<a href="https://github.com/undefined/undefined/issues/000000" target="_blank">#000000</a>',
      info: '#0D47A1',
      warning: '#ffb300',
      error: '#ff1744',
      success: '#2E7D32'
    },
    treeShake: true
  },

  /*
  ** Build configuration
  */
  build: {
    analyze: true,
    babel: {
      presets: ['@babel/preset-env'],
      plugins: [
        '@babel/plugin-syntax-dynamic-import',
        '@babel/transform-runtime'
      ]
    },

    extractCSS: true,
    filenames: {
      app: ({ isDev }) => (isDev ? '[name].js' : '[chunkhash].js'),
      chunk: ({ isDev }) => (isDev ? '[name].js' : '[chunkhash].js'),
      css: ({ isDev }) => (isDev ? '[name].css' : '[contenthash].css'),
      img: ({ isDev }) => (isDev ? '[path][name].[ext]' : 'img/[hash:7].[ext]'),
      font: ({ isDev }) =>
        isDev ? '[path][name].[ext]' : 'fonts/[hash:7].[ext]',
      video: ({ isDev }) =>
        isDev ? '[path][name].[ext]' : 'videos/[hash:7].[ext]'
    },
    /*
    ** You can extend webpack config here
    */
    extend(config, ctx) {
      config.module.rules.push({
        test: /\.scss$/,
        use: ['vue-style-loader', 'css-loader', 'sass-loader']
      })

      // Run ESLint on save
      if (ctx.isDev && ctx.isClient) {
        config.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /(node_modules)/
        })
      }
      if (ctx.isServer) {
        config.externals = [
          nodeExternals({
            // default value for `whitelist` is
            // [/es6-promise|\.(?!(?:js|json)$).{1,5}$/i]
            whitelist: [
              /es6-promise|\.(?!(?:js|json)$).{1,5}$/i,
              /^vue-echarts/
            ]
          })
        ]
      }
    }
  }
}

I don't have any clue as why this sin't working.
Your help is appreciate.

EDIT

Removing options from vuetify module I get:

(node:19981) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'loadResources' of undefined
    at Server.loadResources (/media/test/node_modules/@nuxt/server/dist/server.js:653:26)
    at compiler.hooks.done.tap (/media/test/node_modules/@nuxt/webpack/dist/webpack.js:5089:21)
    at <anonymous>
    at process._tickDomainCallback (internal/process/next_tick.js:229:7)
(node:19981) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
ravisingh96

ravisingh96 posted a new question

modules •

Spelling mistake in readme

Incorrect: See component-level caching for mor information.
Correct: See component-level caching for more information.

msacchetti

msacchetti posted a new question

modules •

How to use Markdown-it extensions

How can we use extensions for markdown? ie. https://www.npmjs.com/package/markdown-it-attrs

yariksav

yariksav posted a new question

modules •

Use modules with typescript and eslint

Hello guys!
Example, if I installed and use nuxtjs/vuetify. Vuetify has own index.d.ts file

Then in project typescript modules eslint will emphasizes with "error not found" all vuetify params, such as this.$vuetify.colors etc

This because all nuxt modules generate from string templates

Question: Is it possible to use some module in this package with typescript and eslint|tslint?

bookyo

bookyo posted a new question

modules •

markdownit how to use highlight

i write markdown content.
after $md.render() :

<pre><code class="language-javascript">var a=123
console.log(2323)
println(2323)
</code></pre>

highlight is not work,.
my nuxt.config.js:

markdownit: {
    breaks: true,
    linkify: true,
    injected: true,
    langPrefix: "language-"
  },
teleyinex

teleyinex posted a new bug report

modules •

bug Vuetify toolbar changes its size when reloading

Version

last

Reproduction link

https://www.npmjs.com/package/@nuxtjs/vuetify

Steps to reproduce

Basically create a project choosing vuetify as the framework. Then, run yarn run dev and wait for the server to start. When it has started reload the page several times, you will see that the toolbar changes its size, bumping.

What is expected ?

The toolbar should not change its size.

What is actually happening?

The toolbar changes its size.

clstudio

clstudio posted a new question

modules •

@nuxt/vuetify with nuxt-i18n: Vuetify translations not showing

Hi, how is it possible to use the built-in vuetify translations (like for datatables) https://vuetifyjs.com/en/framework/internationalization#vue-i18n with nuxt? I'm using @nuxtjs/vuetify and nuxt-i18n, all latest. Vuetify and i18n by itself work perfectly fine.

For instance, I tried the following in nuxt.config:

vueI18n: {
          fallbackLocale: 'en',
          messages: {
            fr: {
              welcome: 'Bienvenue',
              $vuetify: {
                dataIterator: {
                    rowsPerPageText: 'Élements par page:',
                    rowsPerPageAll: 'Tous',
                    pageText: '{0}-{1} de {2}',
                    noResultsText: 'Aucun enregistrement correspondant trouvé',
                    nextPage: 'Page suivante',
                    prevPage: 'Page précédente'
                },
                dataTable: {
                    rowsPerPageText: 'Lignes par page:'
                },
                noDataText: 'Aucune donnée disponible'
              },
brandonpittman

brandonpittman posted a new question

modules •

Expected behavior with .md files as routes doesn't work with markdownit module

<template lang="md> works as expected. The README claims you can use .md files as well, however, pages/hello.md doesn't seem to get converted to a route. Am I oversimplying its usage?</p>

manniL

manniL posted a new feature request

modules •

idea Deprecate optimize-module

What problem does this feature solve?

https://www.npmjs.com/package/@nuxtjs/optimize is obsolete but still normally listed on NPM.

acan13

acan13 posted a new question

modules •

@babel/polyfill and intersection-observer installation errors

I'm trying to simply install the @babel/polyfill and intersection-observer polyfills on my nuxt app and keep running into different bugs. I've looked all over for instructions and answers but can't find anything that's solved.

Steps I followed:

I used npm install to install @babel/polyfill and intersection-observer.

I added module.exports.build.transpile = [ /.(js|vue)$/ ]

I ran npm run dev

Error logs:

Multiple variations of "export 'default' (imported as '_typeof') was not found in '@babel/runtime/helpers/typeof'

Any suggestions on what I've done wrong or what I need to do to implement the @babel/polyfill and intersection-observer polyfills?