broken on nuxt rc10 with externalVue false

[huang-julien]

two versions of estree-walker is present due to rollup and @vue/compiler-core.

[huang-julien]

this issue does not happens with yarn.

[SebastianBoergers]

Happens with yarn too as far as I can tell.

[huang-julien]

i just retried on the edge channel of nuxt. It seems that it has been fixed with the latest fix of nitro externals plugin https://github.com/unjs/nitro/commit/640c2b7a6a28696dc723b9c7ed3d7058f7fc83e9 . I'll leave this issue open until nuxt rc11 or 12 solves this.

[huang-julien]

closed as fixed with rc11

[SebastianBoergers]

Doesn't seem to work for me at the moment with Nuxt RC 11.

frontend-nuxt-1      | [Vue warn]: Runtime compilation is not supported in this build of Vue. Configure your bundler to alias "vue" to "vue/dist/vue.esm-bundler.js".
frontend-nuxt-1      | [Vue warn]: Invalid vnode type when creating vnode: undefined.

However, my config from before i tried using the module still works for some reason.

import { resolve } from 'path';

export default defineNuxtConfig({
  ssr: true,
  srcDir: 'src/',
  build: {
    postcss: {
      postcssOptions: require('./postcss.config.js'),
    },
    transpile: ['@urql/vue'],
  },
  components: {
    global: true,
    dirs: ['@/components'],
  },
  css: ['@/assets/css/styles.css'],
  meta: {},
  hooks: {
    'pages:extend'(pages) {
      pages.push(
        {
          name: 'cmsPage',
          path: '/:path(.*)',
          file: resolve(__dirname, 'src/pages/cms/index.vue'),
        },
        {
          name: '404',
          path: '/404',
          file: resolve(__dirname, 'src/pages/404.vue'),
        },
        {
          name: 'thankYou',
          path: '/:path(.*)/thank-you',
          file: resolve(__dirname, 'src/pages/cms/thank-you.vue'),
        },
      );
    },
    'vite:extendConfig': (config, { isClient, isServer }) => {
      config.resolve.alias.vue = 'vue/dist/vue.esm-bundler';
    },
  },
  nitro: {
    commonJS: {
      dynamicRequireTargets: [
        './node_modules/@vue/compiler-core',
        './node_modules/@vue/compiler-dom',
        './node_modules/@vue/compiler-ssr',
        './node_modules/vue/server-renderer',
        './node_modules/vue',
      ],
    },
  },
  alias: {
    '@vue/compiler-core': '@vue/compiler-core',
    '@vue/compiler-dom': '@vue/compiler-dom',
    '@vue/compiler-ssr': '@vue/compiler-ssr',
    'vue/server-renderer': 'vue/server-renderer',
    'estree-walker': 'estree-walker',
    '@babel/parser': '@babel/parser',
  },
  vue: {
    config: {
      productionTip: false,
      devtools: true,
    },
  },
  vite: {
    resolve: {
      alias: {
        stores: resolve(__dirname, 'src/stores'),
        mixins: resolve(__dirname, 'src/mixins'),
      },
    },
  },
  buildModules: ['@averjs/nuxt-compression'],
  compression: {
    viteCompression: {
      algorithm: 'brotliCompress',
    },
  },
  modules: [
    '@formkit/nuxt',
    '@pinia/nuxt',
    '@vueuse/nuxt',
    '@intlify/nuxt3',
    'nuxt-schema-org',
  ],
  schemaOrg: {
    canonicalHost: 'xxx',
    defaultCurrency: 'EUR',
    defaultLanguage: 'de-DE',
  },
  intlify: {
    vueI18n: {
      fallbackLocale: 'de',
      legacy: false,
      globalInjection: true,
      locale: 'de',
      numberFormats: {
        de: {
          currency: {
            style: 'currency',
            currency: 'EUR',
          },
          currencyNoCents: {
            style: 'currency',
            currency: 'EUR',
            minimumFractionDigits: 0,
            maximumFractionDigits: 0,
          },
          decimal: {
            style: 'decimal',
            minimumFractionDigits: 2,
            maximumFractionDigits: 2,
          },
          percent: {
            style: 'percent',
            useGrouping: false,
          },
        },
      },
    },
  },
  runtimeConfig: {
    CRAFT_CMS_CLIENT_CERTIFICATE_PATH:
      process.env.CRAFT_CMS_CLIENT_CERTIFICATE_PATH,
    public: {
      CRAFT_CMS_URL: process.env.CRAFT_CMS_URL,
      CRAFT_CMS_URL_SSR: process.env.CRAFT_CMS_URL_SSR,
      CRAFT_CMS_GRAPH_QL_TOKEN: process.env.CRAFT_CMS_GRAPH_QL_TOKEN,
      RECAPTCHA_SITE_KEY: process.env.RECAPTCHA_SITE_KEY,
    },
  },
});

I have no idea about this, but maybe you spot something. :) I'm in the upgrade process from Nuxt RC4 to 11, if that matters in any way.

Another thing to point out: I tried to use the module in the first and also in the last position and also in between the other modules - neither made it work.

EDIT: Minor change i forgot to revert before i copy/pasted the config :)

...
      if (isClient) {
        config.resolve.alias.vue = 'vue/dist/vue.esm-bundler';
      }
...

[huang-julien]

Can you provide your current config file ? Nuxt now enable experimental.externalVue by default so nuxt is configured differently depending on this option.

Also are you in a monorepo, if yes, you need to set the nodeModulesRoot option to the directory containing your vue package ?

https://stackblitz.com/edit/nuxt-starter-3cv94w?file=nuxt.config.ts there's also a playground on stackblitz :slightly_smiling_face: feel free to fork it to reproduce your issue :+1:

[SebastianBoergers]

It actually is a mono-repo, however, it's running in docker and process.cwd() seems to be right. But maybe i'm missing something. Gonna look at that again and double-tripple-check everything. The error is probably on my end. :)