I can’t connect the vuejs in the Laravel

Asked

Viewed 902 times

0

See the page:

<!doctype html>
<html lang="{{ app()->getLocale() }}">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Laravel</title>

        <!-- Fonts -->
        <link href="css/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css">


    </head>
    <body>
        <div id="app">
            <h1>@{{ msg }}</h1>
        </div>


        <script src="js/vue/app.js"></script>
        <script src="js/vue/dist/vue.js" ></script>
        <script src="js/axios/dist/axios.js" ></script>

    </body>
</html>

These Javascript files are in the public folder.

I was able to connect Bootstrap, but why I could not connect the Javascript files?

laravel vue.js

  • What error appears in the console when you load this page? And how is the folder hierarchy..

1 answer

1


Good morning! Laravel already brings by default an implementation of Vuejs already configured to work, the easiest way to make Vue work is to use this implementation. If you check in Resources/Assets you will see the css, js and Sass subdirectories. Inside js you will see the Component subdirectory with an example. To use this impementation you must type in the root directory of your application npm install, will then be installed the Laravelmix. It seems a little complicated, but is well explained in the documentation of Laravel in these links Frontend Sacaffolding and Compiling Assets that speaks in more detail of the subject. After the npm install you can rotate npm run dev create a path for the Resources/views/Vue.blade.php file which is an example Vuejs file configured in Laravel. So all your code should be in Resources/Assets/js/Component and always after some change you should run npm run dev to compile the code for the public/js/app.js file (this is the only file you should import into your HTML), all of this is done automatically by running the npm run dev. I strongly suggest you use these features as they are tightly integrated with Blade and make programming much easier. Good luck!

Browser other questions tagged laravel vue.js

You are not signed in. Login or sign up in order to post.