JeffreyWay / laravel-elixir-vueify

This is a very thin wrapper for Laravel Elixir and the Browserify Vueify plugin.
156 stars 30 forks source link

How to use ES syntax? #3

Closed nivv closed 8 years ago

nivv commented 9 years ago

Before elixir 4.0 we could do it like this:

<template>
   <h1>hey</h1>
</template>

<script lang="es">
export default {
    props: {
        msgOnSuccess: String,
        msgOnError: String,
        statusCode: null,
        animated: {
            default: false
        },
    }
}

</script>

I get below error message: 'import' and 'export' may appear only with 'sourceType: module'

My package.json:

{
  "devDependencies": {
    "gulp": "^3.9.0",
    "laravel-elixir": "^4.0.4",
    "laravel-elixir-vueify": "^1.0.0"
  }
}

My gulpfile:

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

elixir(function(mix) {
    mix.browserify('main.js', 'public/js/bundle.js');
});

I've tried to remove my old node_modules and installing again, but same issue persists.

Node version node -v v5.0.0 NPM version npm -v 3.3.6

stevenobird commented 8 years ago

Leave out the type="es" in your Script tag and it should work for now, at least it did for me when I tried to compile with type="es6" You can still use ES5/6 Syntax.

nivv commented 8 years ago

@twaileit Thanks! Also below doesn't work anymore:

import indexUser from './components/users/indexUser.vue';

new Vue({
    el: '#app',

    components: {
        indexUser: indexUser
    }
});

It has to be written like this:

import indexUser from './components/users/indexUser.vue';

new Vue({
    el: '#app',

    components: {
        "indexUser": indexUser
    }
});