5

After running npm run serve it gives an address like http://localhost:8080 and it works, this address is targeted the root folder of local server but my project exists another folder like http://localhost/vue

And my question is how the address http://localhost:8080 works and where is the actual index.html? Since my actual project placed in localhost/vue folder! and the address should be http://localhost/vue

2 Answers 2

5

I think you are a bit confused on what is going on in the background when you use serve.

When you are running the command npm run serve, your project is getting built by Webpack and then "served" via a local http-server. This server is using your project's build folder as it's root.

It seems like you have created a folder named localhost as out of your comments here. http://localhost is not a folder called "localhost" in your computer. In fact, it is just a name for your internal ip: 127.0.0.1. You can test this by going to 127.0.0.1:8080 and seeing this is the same as http://localhost:8080

in programmatic terms, one could say the following: localhost == 127.0.0.1

That out of the way, you seemt to also expect there to be a sub-folder named vue, since that's what you have in your localhost folder. Knowing the above; http://localhost is not a folder localhost on your pc. It is however the folder the http-server has chosen, in this case, vue chooses the folder /dist inside your project folder.

Example: Your project folder has the following path: C:\Users\Admin\Documents\myProject

When you then run npm run serve in that folder, the vue http-server will serve (host) the folder C:\Users\Admin\Documents\myProject\dist

This means http://localhost == C:\Users\Admin\Documents\myProject\dist\index.html

However, if your goal here is to have your project served as: http://localhost/my-custom-sub-folder

You will have to edit the vue.config.js for your vue project by adding: publicPath

vue.config.js example:

module.exports = {
  publicPath: '/my-custom-sub-folder',
};
Sign up to request clarification or add additional context in comments.

1 Comment

I think this needs some correction. Dev server files are stored in memory in default unless you set a specific path for the compiled files.
0

the index.html file should be by default placed at the root of your project in the "public" folder

6 Comments

do you know vue.js
kindof I'm starting using it with django to build SPA, it's pretty straightforward btw, I don't know what you don't understand, is it your first time working with a local server ? because it doesn't really make sense
but that is not the answer i expected
Your question doesn't make sens, you can run npm run serve -- --port 3000 for example if you want to access your project through another port. Seems you don't unserstand how vuejs is working, read the doc, you could choose to use vuerouter when creating your project tho, that way you could access different endpoints pretty easily
i am new in vue.js, i want to know that my vue.js project is inside a folder named vue, so the address should be localhost:8080/vue but it runs in localhost:8080 how?
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.