I got that error too, but mine is:

<style>
^
ParseError: Unexpected token

I'm trying to use the vue-loading-bar component.

Tried to move the component folder to my resources folder but this not solved the problem.

I was having this issue. I was missing this in my gulpfile.js

require('laravel-elixir-vueify');

@chrisreiduk I think that will solve the Problem for all npm version > 3.1 Users that stucks on the Issue :)

Thanks!

According to: http://stackoverflow.com/a/37493941/39539

'Your template is under node_modules. Browserify transforms only apply to "top-level" files, i.e. files from your app, not of your dependencies.'

This is likely why copying them into your app's resources directory allows it to work. The answer suggests using a --global-transform flag but I'm not sure how that'd fit into the laravel-elixir-vueify workflow.

In any case, it appears that copying the resources out of node_modules is "the right way" to do this.

@thinkspill ok, now we know the cause of the problem, but i don't like the idea of copying the resources out of node_modules...

for now, i decided to not use any thirdy party component from vue =/

Could this be the answer https://github.com/substack/node-browserify#browserifytransform

@priithansen i saw something about it on stackoverflow, i even tried to use it but with no success.. But yes, this could be a solution if used right.

I have the same issue. Was google for hours without any result.

I'm trying to use vue-progressbar .

import progress from 'vue-progressbar/vue-progressbar.vue'

Gives me the error.

Regarding browserify transform option, as I understand laravel-vueify already uses this:

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

Elixir.config.js.browserify.transformers.push({
    name: 'vueify',

    // https://github.com/vuejs/vueify#usage
    options: {}
});

I was trying to install laravel-elixir-browserify and specify transform: vueify but I got another error which I couldnt fix: Cannot find module 'laravel-elixir/ingredients/helpers/Utilities'

Same thing happened to me. I switched to webpack() instead of browserify(), then it works.

Me too have the same problem with browserify . Working fine with webpack though . Any ideas ?

Yeah, "laravel-elixir-browserify-official" browserify gives me an unexpected token error? Using webpack worked for the same files....

using gulp only, i get the error also.

    gulp.task('js-build', function () {
      gulp.src([
          config.paths.assetDir + 'js/app.js',
        ])
        .pipe(plugins.browserify())
        .pipe(config.production ? plugins.uglify() : plugins.util.noop())
        .pipe(plugins.concat('foot.js'))
        .pipe(gulp.dest(config.paths.publicDir + 'js'));
    });

events.js:160
      throw er; // Unhandled 'error' event
      ^
SyntaxError:
resources\assets\js\components\Example.vue:1
<template>
^
ParseError: Unexpected token
    at wrapWithPluginError (node_modules\gulp-browserify\index.js:44:10)