search

nuxt / bridge

🌉 Experience Nuxt 3 features on existing Nuxt 2 projects
MIT License
270 stars 29 forks source link

Import aliases of `@nuxtjs/composition-api` have wrong path #366

Closed patrickalima98 closed 1 year ago

patrickalima98 commented 2 years ago

Environment

Reproduction

I just follow the Nuxt bridge migrate guide, and I can't use the @nuxtjs/composition-api.

I don't understand why this problem is in my project, some files to help your understand.

My nuxt config:

import { defineNuxtConfig } from '@nuxt/bridge'
import eslintPlugin from 'vite-plugin-eslint'

import locales from './lang'

export default defineNuxtConfig({
  // Disable server-side rendering: https://go.nuxtjs.dev/ssr-mode
  ssr: true,

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [
    { src: '@/plugins/copyToClipboard.ts' },
    { src: '@plugins/api', ssr: true },
    { src: '@plugins/directive' },
    { src: '@/plugins/nfw.ts', mode: 'client' },
    { src: '@plugins/support.domain' },
    { src: '@plugins/format.price' },
    { src: '@plugins/format.date' },
    { src: '@plugins/full.path' }
  ],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [
    // https://go.nuxtjs.dev/stylelint
    '@nuxtjs/stylelint-module'
  ],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
    // https://go.nuxtjs.dev/axios
    '@nuxtjs/axios',
    '@nuxtjs/dayjs',
    ['nuxt-i18n', {
      locales,
      strategy: 'prefix',
      defaultLocale: 'pt-br',
      lazy: true,
      langDir: 'lang/'
    }],
    'portal-vue/nuxt',
    '@nuxtjs/google-gtag'
  ],
  server: {
    host: '0.0.0.0'
  },
  // Axios module configuration: https://go.nuxtjs.dev/config-axios
  axios: {},

  dayjs: {
    locales: ['pt-br'],
    defaultLocale: 'pt-br',
    plugins: ['localizedFormat']
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {
    transpile: [
      'vuex-composition-helpers',
      '@nuinalp/offers-sdk-js'
    ]
  },

  'google-gtag': {
    id: process.env.G_ANALYTICS
  },

  privateRuntimeConfig: {
    G_ANALYTICS: process.env.G_ANALYTICS
  },

  vite: {
    plugins: [
      eslintPlugin()
    ]
  }
})

My .nuxt/tsconfig.json

// Generated by nuxi
{
  "compilerOptions": {
    "jsx": "preserve",
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "Node",
    "skipLibCheck": true,
    "strict": false,
    "allowJs": true,
    "noEmit": true,
    "resolveJsonModule": true,
    "allowSyntheticDefaultImports": true,
    "types": [
      "node"
    ],
    "baseUrl": "..",
    "paths": {
      "~~": [
        "."
      ],
      "~~/*": [
        "./*"
      ],
      "@@": [
        "."
      ],
      "@@/*": [
        "./*"
      ],
      "~": [
        "."
      ],
      "~/*": [
        "./*"
      ],
      "@": [
        "."
      ],
      "@/*": [
        "./*"
      ],
      "assets": [
        "assets"
      ],
      "assets/*": [
        "assets/*"
      ],
      "static": [
        "static"
      ],
      "static/*": [
        "static/*"
      ],
      "#app": [
        "node_modules/@nuxt/bridge/dist/runtime/index"
      ],
      "nuxt3/app": [
        "node_modules/@nuxt/bridge/dist/runtime/index"
      ],
      "nuxt/app": [
        "node_modules/@nuxt/bridge/dist/runtime/index"
      ],
      "#build": [
        ".nuxt"
      ],
      "#build/*": [
        ".nuxt/*"
      ],
      "defu": [
        "defu"
      ],
      "@nuxtjs/composition-api": [
        "node_modules/@nuxt/bridge/dist/runtime/capi.legacy.d.mts"
      ],
      "#head": [
        ".nuxt/meta"
      ],
      "~i18n-klona": [
        "node_modules/klona/full/index"
      ],
      "#imports": [
        ".nuxt/imports"
      ]
    }
  },
  "include": [
    "./nuxt.d.ts",
    "../**/*"
  ],
  "vueCompilerOptions": {
    "experimentalCompatMode": 2
  }
}

My .nuxt folder content: image

Describe the bug

The Vscode can't find the declaration file to @nuxtjs/composition-api.

Additional context

I'm using the Volar Vs Code extension, and not Vetur.

My package.json:

{
  "name": "nuinalp-offers",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxi dev --port 40520",
    "build": "nuxi build",
    "start": "nuxi preview",
    "generate": "nuxi generate",
    "lint:js": "eslint --ext \".js,.vue\" --ignore-path .gitignore .",
    "lint:style": "stylelint \"**/*.{vue,css}\" --ignore-path .gitignore",
    "lint": "yarn lint:js && yarn lint:style",
    "test": "jest"
  },
  "dependencies": {
    "@nuinalp/api-core": "^0.0.18",
    "@nuinalp/offers-sdk-js": "^0.0.11",
    "@nuiverse/core": "^0.2.11",
    "@nuiverse/icons": "^0.1.2",
    "@nuxtjs/axios": "^5.13.1",
    "@nuxtjs/dayjs": "^1.4.1",
    "@nuxtjs/google-gtag": "^1.0.4",
    "@vue/eslint-config-typescript": "^10.0.0",
    "@vue/runtime-dom": "^3.2.36",
    "awesome-qr": "^2.1.5-rc.0",
    "camel-case": "^4.1.2",
    "clipboard-copy": "^4.0.1",
    "core-js": "^3.9.1",
    "currency.js": "^2.0.4",
    "dayjs": "^1.10.7",
    "easyqrcodejs": "^4.4.10",
    "indicative": "^7.4.4",
    "millify": "^4.0.0",
    "nuxt-edge": "latest",
    "nuxt-i18n": "^6.24.0",
    "portal-vue": "^2.1.7",
    "query-string": "^7.0.1",
    "remove-accents": "^0.4.2",
    "url-parse": "^1.5.3",
    "uuidv4": "^6.2.13",
    "vue-eslint-parser": "^8.0.1",
    "vuex-composition-helpers": "^1.1.0"
  },
  "devDependencies": {
    "@nuxt/bridge": "npm:@nuxt/bridge-edge",
    "@nuxt/types": "^2.15.3",
    "@nuxtjs/eslint-config-typescript": "^10.0.0",
    "@nuxtjs/eslint-module": "^3.0.2",
    "@nuxtjs/stylelint-module": "^4.0.0",
    "@types/js-cookie": "^2.2.7",
    "@types/url-parse": "1.4.1",
    "@typescript-eslint/eslint-plugin": "^5.27.0",
    "@typescript-eslint/parser": "^5.27.0",
    "@vue/eslint-config-airbnb": "^5.3.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "@vue/test-utils": "^1.1.3",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "^10.1.0",
    "babel-jest": "^26.6.3",
    "eslint": "^8.17.0",
    "eslint-config-airbnb-base": "^14.2.1",
    "eslint-config-airbnb-typescript": "^14.0.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-config-typescript": "^3.0.0",
    "eslint-import-resolver-alias": "^1.1.2",
    "eslint-plugin-import": "^2.24.2",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-nuxt": "^2.0.0",
    "eslint-plugin-prettier": "^3.4.1",
    "eslint-plugin-promise": "^5.1.0",
    "eslint-plugin-react": "^7.25.0",
    "eslint-plugin-standard": "^5.0.0",
    "eslint-plugin-typescript": "^0.14.0",
    "eslint-plugin-vue": "^9.1.0",
    "jest": "^26.6.3",
    "sass": "^1.38.2",
    "sass-loader": "10",
    "stylelint": "^13.13.1",
    "stylelint-config-recommended-scss": "^4.3.0",
    "stylelint-config-sass-guidelines": "^8.0.0",
    "stylelint-config-standard": "^21.0.0",
    "stylelint-scss": "^3.20.1",
    "ts-jest": "^26.5.4",
    "typescript": "^4.7.3",
    "typescript-eslint-parser": "^22.0.0",
    "vite-plugin-eslint": "^1.6.1",
    "vue-eslint-parser": "^7.10.0",
    "vue-jest": "^3.0.4"
  }
}

Logs

No response

danielroe commented 2 years ago

Would you provide a minimal reproduction please, from https://stackblitz.com/github/nuxt/starter/tree/v2-bridge?

github-actions[bot] commented 1 year ago

This issue was closed because it was open for 7 days without a reproduction.