GET http://localhost/resources/js/app.js net::ERR_ABORTED 404 (Not Found)

Question

I'm using laravel and vue , but when i try to load the page the data in home.vue doesnt apper is welcome.blade.php and this error appear in the console: `GET http://localhost/resources/js/app.js net::ERR_ABORTED 404 (Not Found)

my webpack file is:

 mix.js('resources/js/app.js', 'public/js')
.vue()
.sass('resources/sass/app.scss', 'public/css');

and my welcome.blade.php is:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <router-view></router-view>
    <script src="/resources/js/app.js"></script>
</body>
</html>

my app.js path is: /resources/js/app.js

Ahsan Zaman · Accepted Answer · 2021-04-19 13:49:14Z

0

Path to yor JS script file is wrong and the browser can't find it. Use mix helper to link to your compiled files. [ also you're missing your styles file. ] You can't use <router-view/> in your blade file rather you need an element with id="app" so that vue can mount.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="{{ mix('css/app.css') }}" />
    <title>Document</title>
</head>
<body>
    <div id="app"></div>
    <script src="{{ mix('js/app.js') }}"></script>
</body>
</html>

edited Apr 19, 2021 at 13:49

answered Apr 19, 2021 at 13:39

Ahsan Zaman

1011 gold badge2 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jad es Over a year ago

problem resolved no longer error ,but the data in home.vue still doesnt apper in welcome.blade.php

JackChouMine · Accepted Answer · 2021-04-19 19:27:23Z

0

change assets path to :

<script src="resources/js/app.js"></script>

or setup webpack build config

assetsPublicPath: './'

or vue.config.js:

module.exports = {
    publicPath: '',
}

There is a reloated problem.

Vue CLI build and run index.html file without server

answered Apr 19, 2021 at 19:27

JackChouMine

1,19213 silver badges27 bronze badges

Collectives™ on Stack Overflow

GET http://localhost/resources/js/app.js net::ERR_ABORTED 404 (Not Found)

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related