TypeError: o is not a function
See original GitHub issue@kazupon @jiaozhiye @VanishMax
I have the same problem at the production level only there is no error for the dev level
System:
OS: Windows 10 10.0.19042
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Memory: 6.37 GB / 15.92 GB
Binaries:
Node: 15.8.0 - C:\Program Files\nodejs\node.EXE
npm: 7.24.1 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Spartan (44.19041.1266.0), Chromium (94.0.992.50)
Internet Explorer: 11.0.19041.1202
packages
"@asigloo/vue-dynamic-forms": "^3.16.3",
"@fortawesome/fontawesome-svg-core": "^1.2.35",
"@fortawesome/free-solid-svg-icons": "^5.15.3",
"@fortawesome/vue-fontawesome": "^3.0.0-4",
"@hennge/vue3-pagination": "^1.0.17",
"@popperjs/core": "^2.10.1",
"@vueform/multiselect": "^2.2.0",
"@vueuse/core": "^6.4.1",
"@vueuse/integrations": "^6.3.2",
"core-js": "^3.18.0",
"cors": "^2.8.5",
"dayjs": "^1.10.7",
"express": "^4.17.1",
"litepie-datepicker": "^1.0.14",
"primeicons": "^4.1.0",
"primevue": "^3.7.1",
"router-link": "0.0.4",
"vue-draggable-next": "^2.0.1",
"serve-static": "^1.14.1",
"vee-validate": "^4.4.11",
"vue": "^3.2.11",
"vue-i18n": "^9.1.9",
"vue-loading-overlay": "^4.0.4",
"vue-multiselect": "^3.0.0-alpha.2",
"vue-next-select": "^2.10.1",
"vue-router": "^4.0.10",
"vue-search-select": "^2.9.4",
"vue-sidebar-menu": "^5.0.0-alpha.9",
"vue-simple-search-dropdown": "^1.0.1",
"vue-sweetalert2": "^5.0.2",
"vue-tailwind-picker": "^2.0.0",
"vue-toastification": "^2.0.0-rc.1",
"vue-upload-drop-images": "^1.0.7",
"vue3-table-lite": "^1.0.6",
"vue3-tailwind-datepicker": "^1.0.16",
"vuex": "^4.0.2",
"yup": "^0.32.9"
config I18n
const i18n = createI18n(
{
globalInjection: true,
legacy: false,
inheritLocale: true,
locale: localStorage.getItem('locale'),
availableLocales: ['ar', 'en', 'ku'],
messages: {
en: en,
ar: ar,
ku: ku
},
}
)
app.use(i18n)
error
code
<template>
<div class="flex">
<!-- Backdrop -->
<div
:class="isOpen ? 'block' : 'hidden'"
class="fixed z-20 inset-0 bg-black opacity-50 transition-opacity lg:hidden"
@click="isOpen = false"
></div>
<div
:class="isOpen ? 'translate-x-0 ease-out' : '-translate-x-full ease-in'"
class="fixed z-30 inset-y-0 left-0 w-50 transition duration-300 transform bg-gray-900 overflow-y-auto lg:translate-x-0 lg:static lg:inset-0"
>
<!-- Logo Link -->
<router-link to="/dashboard">
<div class="flex items-center justify-start mt-8">
<div class="flex items-center">
<svg
class="h-12 w-12"
fill="none"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M364.61 390.213C304.625 450.196 207.37 450.196 147.386 390.213C117.394 360.22 102.398 320.911 102.398 281.6C102.398 242.291 117.394 202.981 147.386 172.989C147.386 230.4 153.6 281.6 230.4 307.2C230.4 256 256 102.4 294.4 76.7999C320 128 334.618 142.997 364.608 172.989C394.601 202.981 409.597 242.291 409.597 281.6C409.597 320.911 394.601 360.22 364.61 390.213Z"
fill="#4C51BF"
stroke="#4C51BF"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
/>
<path
d="M201.694 387.105C231.686 417.098 280.312 417.098 310.305 387.105C325.301 372.109 332.8 352.456 332.8 332.8C332.8 313.144 325.301 293.491 310.305 278.495C295.309 263.498 288 256 275.2 230.4C256 243.2 243.201 320 243.201 345.6C201.694 345.6 179.2 332.8 179.2 332.8C179.2 352.456 186.698 372.109 201.694 387.105Z"
fill="white"
/>
</svg>
<span class="text-white text-2xl mx-2 font-semibold"
>{{ $t('pos') }}</span
>
</div>
</div>
</router-link>
</div>
</div>
</template>
<script lang="ts" setup>
import {ref} from "vue";
import {useSidebar} from "/src/hooks/useSidebar";
const {isOpen} = useSidebar();
const activeClass = ref(
"bg-gray-600 bg-opacity-25 text-gray-100 border-gray-100"
);
const inactiveClass = ref(
"border-gray-900 text-gray-500 hover:bg-gray-600 hover:bg-opacity-25 hover:text-gray-100"
)
</script>
Vite config
import {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import vueI18n from "@intlify/vite-plugin-vue-i18n";
export default defineConfig({
devServer: {
watchOptions: {
poll: true,
},
},
define: {
'process.env': process.env
},
plugins: [
vue(), // you need to install `@vitejs/plugin-vue`
vueI18n({
// if you want to use Vue I18n Legacy API, you need to set `compositionOnly: false`
// compositionOnly: false,
// you need to set i18n resource including paths !
include: path.resolve(__dirname, './path/to/src/locales/**')
})
],
resolve: {
alias: {
'@': path.resolve(__dirname, '/src'),
'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js' //解决警告You are running the esm-bundler build of vue-i18n. It is recommended to configure your bundler to explicitly replace feature flag globals with boolean literals to get proper tree-shaking in the final bundle.
, 'vue': 'vue/dist/vue.esm-bundler.js'
},
},
server: {
hmr: {
protocol: 'ws',
host: 'localhost',
overlay: false
},
open: true,
},
})
src Folder structure
_Originally posted by @zeyadsharo in https://github.com/intlify/vue-i18n-next/issues/746#issuecomment-944892389_
Issue Analytics
- State:
- Created 2 years ago
- Reactions:3
- Comments:12 (2 by maintainers)
Top Results From Across the Web
TypeError: "x" is not a function - JavaScript - MDN Web Docs
The JavaScript exception "is not a function" occurs when there was an attempt to call a value from a function, but the value...
Read more >TypeError: o is not a function · Issue #2228 - GitHub
I'm using ... React Grid; React Chart; React Scheduler · Current Behaviour. TypeError: o is not a function. when executing · Expected Behaviour....
Read more >How to Handle JavaScript Uncaught TypeError: “x” is Not a ...
The Javascript error TypeError: "x" is not a function occurs when there is an attempt to call a function on a value or...
Read more >d3.js Uncaught TypeError: o is not a function - Stack Overflow
The problem here is just this method in the line generator: .curve("linear");. In D3 v4.x, there is no curve named "linear" .
Read more >JavaScript: Uncaught TypeError: n is not a function
Uncaught TypeError: 'n' is not a function: This is a standard JavaScript error when trying to call a function before it is defined....
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Resolved with : runtimeOnly: false
Thank you for your reporting!
Sorry, I’m late due to my day job and family matters 😞 Please wait … 🙏