Import js file into template vuejs and laravel

Question

Import js file into template vuejs and laravel

Navigation

#1 by (0 votes)

1

I'm creating a simple application and need to import some js and specific css files on a particular page, but how do you do that? In my template (Login.vue) I tried

<script>
    require('./assets/js/pages/forms.js');
</script>

and

<script src="./assets/js/pages/forms.js"></script>

Remembering that I'm using laravel to generate the application, so all files are concentrated on resources / assets / , already the style files and other js files are in / public / assets / .

How could I, in my vuejs template, import any files that are in the public folder?

vue.js laravel-5.5

asked by anonymous 12.01.2018 / 02:12

1 answer

How to keep checkbox selected after refresh on page with localstorage JS Discover the format of files without extension

score 0 · Accepted Answer

To import .js files into a .vue file, I usually use import ( import syntax ), below:

import forms from './assets/js/pages/forms'; // verifique se o diretório está correto

If js has a export , such as export function , a function can be imported like this:

import { nomeDaFuncao } from 'nome-do-arquivo';

And in the file nome-do-arquivo.js it would look like this:

export function nomeDaFuncao () {
  // código
}

That is, in my experience usually the .js file exports something that later on a .vue component can import into its <script> tag. Note that does not need to be a function to be exported, you can use export default or module.exports for objects.

Note: I usually have two separate "applications", the front-end in Vuejs and the back-end in Laravel, your example that in the case I understood everything is in the same place. I did not have time to test, but from what I understand and researched I believe it will work. They can edit / correct if I am wrong, I am trying to help with what I know.