使用 jquery 的 Gulp 脚本不起作用

Question

I try to use gulp in my new laravel project. Laravel uses by default the laravel-elixir package.

Here is is gulpfile.js:

var elixir = require('laravel-elixir');

elixir(function(mix) {
  mix
    .sass([
      "app.scss"
    ])
    .scripts([
      "vendor/jquery-2.1.4.min.js",
      "app.js",
    ], 'public/js/app.js')
    .version([
      "css/app.css",
      "js/app.js",
    ]);
});

After running gulp in the terminal and visiting the page, the css file is successfully loading but I get a 403 error while loading the js file. I include the version build of the js via <script src="{{ elixir('js/app.js') }}"></script> and the file which wants to load exists. If i remove the line where I include jquery, everything works fine.

I can fix this problem temporary by running chmod -R 777 public/build/ but after running gulp again I get the same error again.

Any ideas how to fix this problem?

Answer 1

After hours of testing I found the solution.

The jquery file in resources/assets/js/vender has 640 permissions. It looks like that the permissions are taken for the first file in the scripts array. I changed the jquery permissions to 664 and now it works fine.

Answer 2

i had the same issues i solve it by run '/libs/jquery.js' in the beginner of the script

 elixir(function(mix) { mix.sass('app.scss'). styles([ 'libs/blog-post.css', 'libs/bootstrap.min.css', 'libs/font-awesome.min.css', 'libs/font-awesome.css', 'libs/styles.css', ],'./public/css/libs.css'). scripts([ 'libs/jquery.js', 'libs/bootstrap.js', 'libs/bootstrap.min.js', 'libs/scripts.js', ],'./public/js/libs.js'); });