Vue Js error message: The following dependency could not be found: * core-js/fn/promise

While working on my Vuejs App, I encountered an error related to promises: 

I received the following error message: "This dependency was not found: core-js/fn/promise in ./src/store/index.js. To resolve this, you can run: npm install --save core-js/fn/promise"
Here is a snippet from my package.json file:

"dependencies": {
    "axios": "^0.21.1",
    "bootstrap": "^4.5.3",
    "core-js": "^3.6.5",
    "jquery": "^3.5.1",
    "popper.js": "^1.16.1",
    "vue": "^2.6.11",
    "vue-axios": "^3.2.2",
    "vue-router": "^3.2.0",
    "vuex": "^3.4.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/eslint-config-standard": "^5.1.2",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-import": "^2.20.2",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11"
  },

After running the command npm install --save core-js/fn/promise, the issue still persists.

vue.jspromise

Answer №1

Today I encountered a similar error. The reason being the statement 

import { reject } from "core-js/fn/promise"
. Once I removed this line, the application compiled successfully.

Answer №2

You can fix the issue by updating your core-js dependency version with the following steps:

npm install core-js
// or
yarn add core-js

The error is occurring because the yourProject/node_modules/core-js is not synchronized with your code.

You have imported core-js/fn/promise, but the build tool cannot find it.

Answer №3

Encountered a similar issue with core-js while attempting to start a new Vue application, resulting in the following error:

core-js/modules/es6.array.find in ./src/state/helpers.js,
* core-js/modules/es6.function.name in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/_base-link.vue?vue&type=script&lang=js&, ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/_base-icon.vue?vue&type=script&lang=js& and 4 others
...
..
..

To resolve this, I updated dependencies and modified my package.json as follows:

{
 ...
 "dependencies": {
  "core-js": "^2.6.12",
  "vue": "2.5.16"
 },
 "devDependencies": {
  "@babel/core": "^7.14.6",
 }
}

Answer №4

To achieve success, carry out the following instructions:

install the necessary dependency by running npm install name,
run the command npm install

The process is functioning flawlessly on my end.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for successfully passing an image using props in Vuejs without experiencing the issue of disappearing content when there is no image present

Is there a way to make a component that can function with or without an image? Currently, when the component doesn't have an image, other contents and styles disappear. How can I resolve this issue? App.Vue: <template> <div id="app&qu ...

htmlcssvue.js

VueJS Error: Attempting to access a property that is undefined causing a TypeError (reading 'toLowerCase')

Whenever I attempt to filter and remove items from an array, everything works fine. However, when I try to add new items to the array, I encounter an error message that says "TypeError: Cannot read properties of undefined (reading 'toLowerCase'). ...

javascriptvue.jsvuejs2vue-componentvuex

I need help figuring out how to represent a nested array within an array of objects within my data instance in Vue

Currently, I have a loop that is showcasing a list of items along with their respective sub-items. The data response payload for this operation appears like the following. I have successfully executed the loop and managed to display it on my frontend desi ...

javascriptarraysvue.jsnuxt.js

When configuring lint-staged, a file is created that includes a unique identifier with details on the packages that have been

When starting a new Vue project, I use npm init vue@latest and select all options (including Eslint with Prettier). For this setup, I am on Windows 11 with node v17.4 and npm v8.4. After creating the project via PowerShell, I switch to Visual Studio Code ...

vue.jsnpmlint-staged

Tips for incorporating a conditional statement within a vue.js :attr

In the input field, I have set a minimum and maximum value. Sometimes, the maximum value is incorrectly set to 0 when it should be disabled or set to a higher number like 150. What would be the most effective way to create a conditional statement to addre ...

vue.jsvuejs2

What is the best way to include a new array at the beginning of a lexicographically sorted array?

After lexicographically sorting an array, I am trying to figure out how to add values from another array "cityOfTheMoscow" first and then maintain the lexigraphical order. However, while using the code snippet below: result.unshift(...self.cityOfTheMoscow ...

javascriptarraysapisortingvue.js

Guide to fetching and displaying a PDF file in the browser using Vue.js and Axios

Despite successfully using Axios to download a pdf file on the browser with correct page numbers and orientation, the content appears to be empty. Here is the API code snippet: [HttpGet] [Route("~/api/Document")] public HttpResponseMessage Get(in ...

c#apivue.jsdownloadaxios

The environment variable process.env.variable works perfectly fine during local development, however, it seems to malfunction once the application is deployed to Heroku within

Currently, I am utilizing nuxt.js and attempting to display images dynamically. To achieve this, I have implemented the BASE_URL variable within the .env file, allowing me to access image files based on the set BASE_URL in my local environment. .env file ...

vue.jsherokudeploymentweb-deploymentnuxt.js

What steps can be taken to resolve the error message "Echo is not recognized"?

Currently, I am handling a project with Laravel 7 along with Vue.js and Laravel-echo. The setup involved installing the Laravel Echo library using npm install --save laravel-echo pusher-js within my application. Additionally, the necessary code was include ...

laravelvue.jswebsocketlaravel-echopusher-js

JavaScript promises do not guarantee the execution of the loop

There was a block of Javascript code that I needed to modify. Initially, the code looked like this: if(!this.top3){ const promises = this.images.map((el, index) => { return this.getData(el.title, index); }); return Promise.all(promise ...

javascriptvue.js

My Vue component seems to be missing in my Vue.js project

Here is the code for my header.vue component: <template> <div> <h2>this is header h2</h2> </div> </template> <script> export default { name: 'Header', data () { return { dat ...

vue.js

Deploying Nuxt with IIS: A Step-by-Step Guide

I am struggling to deploy Nuxt in IIS using IIS Node. The npm run start command works on my server, but since I have other projects like admin and API (.net) running on port 80, it is occupied. However, the structure works fine in IIS. Here is the code sn ...

vue.jsiisnuxt.jsiisnode

Do these exports serve the same purpose?

Can someone help me understand why one export works while the other doesn't? I've tried to figure it out on my own but I'm stuck. Functioning Example const dataStore = new Vapi({ baseURL: 'http://domain.test/api', state: ...

javascriptvue.jsecmascript-6

Make sure to wait for the VueX value to be fully loaded before loading the component

Whenever a user attempts to directly navigate and load a component URL, a HTTP call is initiated within my Vuex actions. This call will set a value in the state once it has been resolved. I am looking to prevent my component from loading until the HTTP ca ...

javascriptvue.jsvuejs2vuexvue-router

Having trouble with dynamic path generation for router-link in Vuejs when using a v-for loop?

//main.js import Vue from "vue"; import App from "./App.vue"; import VueRouter from "vue-router"; import HelloWorld from "./components/HelloWorld.vue"; Vue.use(VueRouter); const router = new VueRouter({ routes: [{ path: "/", component: HelloWorld }] } ...

javascriptvue.js

The component cannot be created using shallowMount because vm.$refs['VTU_COMPONENT'] is not defined

Not sure if it's a bug or if I'm making a mistake. I attempted to use shallowMount to mount my main App component, but it doesn't seem to work. The error message I receive is: Cannot set properties of undefined (setting 'hasOwnProper ...

javascriptvue.jsjestjsvue-test-utils

Vue.js App encounters Recaptcha contact form 7 with a status of "spam"

I recently developed a Vue.js application that operates on a subdomain within the same main domain as my WordPress site. To submit a form to the contact form 7 rest API, I utilized the axios package. However, every time I submit the form, I receive a respo ...

wordpressvue.jsrecaptchacontact-form-7

What is the significance of having both nulls in vue's ref<HTMLButtonElement | null>(null)?

Can you explain the significance of these null values in a vue ref? const submitButton = ref<HTMLButtonElement | null>(null); ...

typescriptvue.js

Issue of delayed loading of CSS in Vue.js application

My vue PWA is experiencing slow loading of CSS when using Vue Bootstrap and Buefy. I attempted to use V cloak, but it only hides components milliseconds after the raw HTML is briefly displayed without any CSS applied. I am looking for a method to display ...

cssvue.js

Tips for correctly loading images and spritesheets using Phaser 3 and Webpack

I am currently working on a Vue app using Webpack and Phaser 3. My main goal is to properly load images and spritesheets in the main scene of the game. import Phaser from 'phaser' export class MainScene extends Phaser.Scene { constructor () { ...

vue.jswebpackphaser-framework