A comparison of Vue's import paths: exploring the variations

Exploring the world of Vue has been exciting but I'm a bit puzzled by the syntax used for importing different libraries. Take, for instance, this import statement:

import Vue from 'vue';
import axios from 'axios';

Where do these references to vue and axios come from? It's strange because usually imports are done using paths. If this question has already been answered elsewhere, apologies for not finding it. Thank you in advance! :-)

Answer №1

When you open up package.json, you'll find a list of dependencies:

{
    "name": "resources",
    "version": "0.1.0",
    "private": true,
    "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build"
    },
    "dependencies": {
        "axios": "^0.20.0",
        "core-js": "^3.6.5",
        "vue": "^2.6.12",
    },
    "devDependencies": {
        "@vue/cli-plugin-babel": "~4.5.6",
        "@vue/cli-service": "~4.5.6",
        "sass": "^1.26.11",
        "sass-loader": "^10.0.2",
        "vue-template-compiler": "^2.6.12"
    },
    "browserslist": [
        "> 1%",
        "last 2 versions",
        "not dead"
    ]
}

These npm packages have been installed using npm i <package> and reside in your node_modules folder. You don't need to specify relative paths for them; simply import them as demonstrated in your code snippet, and node will locate them automatically.

Answer №2

Webpack is typically the loader responsible for defining and configuring how paths are resolved, especially in relation to Vue.

If you want more in-depth information on this topic, check out: https://webpack.js.org/concepts/module-resolution/

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

Error Encountered: Module Missing Following NPM Installation

I just started using Node and ran into an issue after setting up a new node project with NPM init. I tried installing lodash by running the command: npm install lodash --save However, the command resulted in the following error: npm ERR! code MODULE_NOT ...

ASP.net is encountering difficulty locating a specific JavaScript function

Seeking assistance to comprehend the issue, I have devoted countless hours scouring Google for a resolution. Current tools in use: ASP.NET entity framework Within a view, the following code is utilized: <button type="button" id="btnGraf ...

What could be causing the updated JavaScript file to not run on a live Azure website using ASP.NET MVC?

After making a minor adjustment to my JavaScript file on my deployed ASP MVC website hosted on Azure, I decided to redeploy everything. However, upon checking the resource files, I noticed that the JavaScript had indeed been changed, but the behavior of th ...

Guide to accessing a particular object key within an array by leveraging the MUI multiple autocomplete feature coupled with the useState hook

How can I retrieve the id key from a selected object in a given array list and set it to the state? You can find a sandbox example at this link: https://codesandbox.io/s/tags-material-demo-forked-ffuvg4?file=/demo.js ...

Dragging a div element within a table

I am working on an HTML code where I need to make the colored divs draggable and fit them into specific table cells. The green div should occupy 2 cell spaces, light blue 3 cell spaces, yellow 4 cell spaces, and dark blue 5 cell spaces. While I have the d ...

Internet Explorer struggling to function due to JavaScript errors

While Chrome and Firefox breeze through the page, it seems to hang for an eternity in Internet Explorer. Here is the problematic page: ============= Error Details: User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2 ...

Challenges with dynamically adding rows using jQuery

I am trying to create a dynamic form that allows users to select a project and then populates tasks based on the selected project from a database query. The user can then enter hours for each task, which are updated based on the project id and task id comb ...

Is the presence of the selenium webdriver being registered?

Is there a method to detect if a website can tell I am using a bot while running Selenium WebDriver in Python or Puppeteer in JavaScript? Are there any resources that indicate whether a bot test would be failed, such as Cloudflare or Captcha? Appreciate a ...

MongoSearch: A Geo-Targeted Search Engine tailored to your needs

For my new app project, I am using MongoDB, Express, JS, and Node to create a platform similar to Yelp. After some research, I discovered how to search for multiple fields within a campus schema (including campuses, restaurants, barbershops, and names). No ...

Tips for passing a page as an argument in the function parameter of the page.evaluate() method?

I keep running into this issue when I pass the page as an argument: TypeError: Converting circular structure to JSON --> commencing at object with constructor 'BrowserContext' | property '_browser' -> object with const ...

Angular is encountering an issue where it is unable to read the value of a JavaScript function, despite the object having a value

I have developed some JavaScript functions that involve reading and writing to a JSON file, with the intention of calling them in an Angular environment (from TypeScript code) using the jsonfile library. Below is the code snippet: function savePatient(pa ...

`Javascript often returns NaN for basic calculations`

Hello, I am currently developing a basic calculator for a game but I have encountered an issue. Despite having just started learning this programming language and reading all available tutorials, I am now in the process of writing code to gain more experie ...

Employing square bracket notation based on the input data

I'm currently in the process of enhancing some code within my library, but I've encountered a perplexing issue with bracket notation not functioning as expected when attempting to call an imported class. The parameter type expects a camelCased s ...

Is there a way to organize a list of arrays within a loop based on a specific index within each array in JavaScript?

Greetings, I am currently facing an issue with sorting a specific object of arrays. The structure is as follows: Allow me to provide a clearer example - I am receiving a string from an AJAX call formatted like this: "name|price|blah|blah@name|price|blah| ...

Dealing with HTML and Escaping Challenges in jQuery Functions

Here is a string I have: var items = "<div class='item'><div class='item-img' style='background-image: url('images.123.jpg')'></div></div>" I am looking to update the inner HTML of a div: $ ...

What are the proper ways to implement JavaScript conditions?

Having an issue with my slider function, as it currently only works once with the moveRight() method. To address this problem, I attempted to implement a condition that disables the move function and modifies the attributes of links on the second click. H ...

When access to Ajax .responseText in an alert it can be displayed, however it cannot be stored in a variable or

var response_var=""; // Added for debugging purposes ajax.onreadystatechange = function() { if (ajax.readyState == 4 & ajax.status == 200) { response_var = ajax.responseText; alert(ajax.responseText); // This alerts properly (some text ...

Tips for preserving an HTML dynamic table in a database

I have a challenge where I am generating a dynamic HTML table using javascript. What is the best way to store this dynamic HTML table in a database using CodeIgniter? This is the code snippet for my input form: <table id="tb3" name="tb3"> & ...

Conceal div elements and retain their status when the page is reloaded or switched

I currently have 3 div elements displayed on a webpage: header-div fixed_menu_div page_cont Each of these divs are styled with the following CSS properties: #header-div { top:0; left:0; display:inline; float:left; } #page_cont { mar ...

Utilizing jQuery to dynamically update background colors within an ASP repeater based on the selected value of a dropdown list

On my asp.net web page, I have a repeater that displays a table with various fields in each row. I am trying to make it so that when the value of a dropdown within a repeater row changes, the entire row is highlighted in color. While I have achieved this s ...