import js file from public folder in a vue component (Laravel)

Question

I need to import a file "js" from folder "public" in a vue component.

my Vue component:

<template>
  <div>
    <h2>Hello</h2>
  </div>
</template>
<script>

   import {myplugin} from "/public/vendor/jquery/jquery.min.js";
   export default {
      name: "pageone"
   }
</script>

but i receive an error in compiling phase, can someone help me?

You need to use relative path, I assume. Something like from '../../../public/vendor/jquery/jquery.min.js' — senty
– senty, Commented Jan 1, 2020 at 14:25
Why is there a vendor folder in your public folder? jquery is most likely also present already (depending on which version of Laravel/Laravel UI you're using). Include/require jquery via npm. laravel.com/docs/master/mix#working-with-scripts — user8034901
– user8034901, Commented Jan 1, 2020 at 14:27
Also, this import {myplugin} from is wrong. Should be something like import * as jQuery from ... — T. Short
– T. Short, Commented Jan 1, 2020 at 14:31

senty · Accepted Answer · 2020-01-01 15:07:16Z

4

(Although it's not a very good idea to place your libraries/packages to public folder when using compilers), if you really want to place it in public folder, you should use a relative_path.

import {myplugin} from "../../public/vendor/jquery/jquery.min.js";

However, I'd install it as npm package and leverage laravel-mix for adding jquery in my build.

answered Jan 1, 2020 at 15:07

senty

12.9k31 gold badges142 silver badges268 bronze badges

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

Comments

ZhangChn · Accepted Answer · 2022-03-30 18:47:33Z

-1

No need to import it.

Just add a <script src="/path/to/your.js"> into head section of public/index.html.

answered Mar 30, 2022 at 18:47

ZhangChn

3,17423 silver badges42 bronze badges

Collectives™ on Stack Overflow

import js file from public folder in a vue component (Laravel)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related