vue-i18n icon indicating copy to clipboard operation
vue-i18n copied to clipboard

TypeError: _vueI18n.default is not a constructor

Open mshahoyi opened this issue 4 years ago • 3 comments

I am having the same issue as #157. I can not reproduce it though. It appears only the one specific project I am working on exhibits this issue. I created a new project and it was working fine. However, jest config, babel config and typescript config on the erroneous project is the same as the working project.

Babel config;

module.exports = {
  presets: ['@vue/cli-plugin-babel/preset'],
  plugins: [['dynamic-import-node', { noInterop: true }]],
}

Jest config;

module.exports = {
  preset: '@vue/cli-plugin-unit-jest/presets/typescript-and-babel',
  setupFilesAfterEnv: ['<rootDir>/tests/setupFiles.ts'],
}

tsconfig;

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": ["webpack-env", "jest", "vuetify", "webpack", "webpack-env"],
    "paths": {
      "@/*": ["src/*"]
    },
    "lib": ["esnext", "dom", "dom.iterable", "scripthost"]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx",
    "tests/unit/example.spec.ts",
    "tests/unit/modules/core/store/notificationsStore.spec.js",
    "tests/setupFiles.js"
  ],
  "exclude": ["node_modules"]
}

my setupFilesAfterEnv.ts;

import '@testing-library/jest-dom'
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import Vuetify from 'vuetify'

Vue.use(Vuetify)
Vue.use(VueI18n)

new VueI18n()

Jest fails to run the tests and gives me the following error;

  ● Test suite failed to run

    TypeError: _vueI18n.default is not a constructor

       9 | Vue.use(VueI18n)
      10 | 
    > 11 | new VueI18n()
         | ^
      12 | 

      at Object.<anonymous> (tests/setupFiles.ts:11:1)
          at Array.forEach (<anonymous>)

Even if I provide the correct options to the constructor, it still wont work. The strange thing is that, it only fails on testing. Calling the class in the code itself works when I yarn serve!

Here is my dependencies in package.json;

"dependencies": {
    "@websanova/vue-auth": "^4.0.3",
    "axios": "^0.21.0",
    "camelcase-keys": "^6.2.2",
    "core-js": "^3.8.1",
    "roboto-fontface": "*",
    "snakecase-keys": "^3.2.1",
    "v-currency-field": "^3.1.1",
    "vee-validate": "^3.4.5",
    "vue": "^2.6.11",
    "vue-axios": "^3.2.0",
    "vue-class-component": "^7.2.3",
    "vue-i18n": "8.0.0",
    "vue-property-decorator": "^9.1.2",
    "vue-router": "^3.4.9",
    "vuetify": "^2.3.19",
    "vuex": "^3.6.0",
    "vuex-class": "^0.3.2"
  },
  "devDependencies": {
    "@testing-library/jest-dom": "^5.11.6",
    "@testing-library/vue": "^5.6.1",
    "@types/jest": "^26.0.17",
    "@typescript-eslint/eslint-plugin": "^4.9.1",
    "@typescript-eslint/parser": "^4.9.1",
    "@vue/cli-plugin-babel": "^4.5.9",
    "@vue/cli-plugin-e2e-cypress": "^4.5.9",
    "@vue/cli-plugin-eslint": "^4.5.9",
    "@vue/cli-plugin-router": "^4.5.9",
    "@vue/cli-plugin-typescript": "^4.5.9",
    "@vue/cli-plugin-unit-jest": "^4.5.9",
    "@vue/cli-plugin-vuex": "^4.5.9",
    "@vue/cli-service": "^4.5.9",
    "@vue/eslint-config-prettier": "^6.0.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "@vue/test-utils": "^1.1.1",
    "eslint": "^7.15.0",
    "eslint-plugin-prettier": "^3.2.0",
    "eslint-plugin-vue": "^7.2.0",
    "flush-promises": "^1.0.2",
    "prettier": "^2.2.1",
    "sass": "^1.30.0",
    "sass-loader": "^10.1.0",
    "typescript": "~4.1.2",
    "vue-cli-plugin-i18n": "~1.0.1",
    "vue-cli-plugin-vuetify": "^2.0.8",
    "vue-template-compiler": "^2.6.11",
    "vuetify-loader": "^1.3.0",
    "vuex-module-decorators": "^1.0.1"
  }

mshahoyi avatar Dec 16 '20 06:12 mshahoyi

i have same probrem @9.1.8. but [email protected] is work.

syagawa avatar Oct 06 '21 02:10 syagawa

same to fix it, thanks

ljh1234 avatar Mar 11 '22 04:03 ljh1234

https://vue-i18n.intlify.dev/guide/#javascript 9.x use VueI18n.createI18n to create

Stapxs avatar Dec 06 '22 08:12 Stapxs