wigogeo

wigogeo

Member Since 1 Year Ago

Experience Points 110
Experience Level 1

4,890 experience to go until the next level!

In case you were wondering, you earn Laracasts experience when you:

  • Complete a lesson — 100pts
  • Create a forum thread — 50pts
  • Reply to a thread — 10pts
  • Leave a reply that is liked — 50pts
  • Receive a "Best Reply" award — 500pts
Lessons Completed 0
Lessons
Completed
Best Reply Awards 0
Best Reply
Awards
  • start-engines Created with Sketch.

    Start Your Engines

    Earned once you have completed your first Laracasts lesson.

  • first-thousand Created with Sketch.

    First Thousand

    Earned once you have earned your first 1000 experience points.

  • 1-year Created with Sketch.

    One Year Member

    Earned when you have been with Laracasts for 1 year.

  • 2-years Created with Sketch.

    Two Year Member

    Earned when you have been with Laracasts for 2 years.

  • 3-years Created with Sketch.

    Three Year Member

    Earned when you have been with Laracasts for 3 years.

  • 4-years Created with Sketch.

    Four Year Member

    Earned when you have been with Laracasts for 4 years.

  • 5-years Created with Sketch.

    Five Year Member

    Earned when you have been with Laracasts for 5 years.

  • school-session Created with Sketch.

    School In Session

    Earned when at least one Laracasts series has been fully completed.

  • welcome-newcomer Created with Sketch.

    Welcome To The Community

    Earned after your first post on the Laracasts forum.

  • full-time-student Created with Sketch.

    Full Time Learner

    Earned once 100 Laracasts lessons have been completed.

  • pay-it-forward Created with Sketch.

    Pay It Forward

    Earned once you receive your first "Best Reply" award on the Laracasts forum.

  • subscriber-token Created with Sketch.

    Subscriber

    Earned if you are a paying Laracasts subscriber.

  • lifer-token Created with Sketch.

    Lifer

    Earned if you have a lifetime subscription to Laracasts.

  • lara-evanghelist Created with Sketch.

    Laracasts Evangelist

    Earned if you share a link to Laracasts on social media. Please email [email protected] with your username and post URL to be awarded this badge.

  • chatty-cathy Created with Sketch.

    Chatty Cathy

    Earned once you have achieved 500 forum replies.

  • lara-veteran Created with Sketch.

    Laracasts Veteran

    Earned once your experience points passes 100,000.

  • 10k-strong Created with Sketch.

    Ten Thousand Strong

    Earned once your experience points hits 10,000.

  • lara-master Created with Sketch.

    Laracasts Master

    Earned once 1000 Laracasts lessons have been completed.

  • laracasts-tutor Created with Sketch.

    Laracasts Tutor

    Earned once your "Best Reply" award count is 100 or more.

  • laracasts-sensei Created with Sketch.

    Laracasts Sensei

    Earned once your experience points passes 1 million.

  • top-50 Created with Sketch.

    Top 50

    Earned once your experience points ranks in the top 50 of all Laracasts users.

29 Aug
10 months ago

wigogeo started a new conversation "Syntax Error" On IE And" Unexpected Keyword 'const'" On Safari

Hi guys,

i made an SPA application with Laravel (5.6.35) and VueJS (2.1.8).

It works perfectly on Chrome and Firefox but not on IE and Safari.

I get this error on IE : "SCRIPT1002: Syntax error on :"

class PerMessageDeflate {

This line is in my app.js (In public/js folder).

So i tried to use babel-polyfill and es6-promise in my ressources/assets/js/bootstrap.js :

window._ = require('lodash');

/**
 * We'll load jQuery and the Bootstrap jQuery plugin which provides support
 * for JavaScript based Bootstrap features such as modals and tabs. This
 * code may be modified to fit the specific needs of your application.
 */

try {
    window.$ = window.jQuery = require('jquery');
    // require('bootstrap-sass');
} catch (e) {}





import Es6Promise from 'es6-promise';
Es6Promise.polyfill();

import "babel-polyfill";

import Vue from 'vue';
import Vuex from 'vuex';
import VueRouter from 'vue-router';
import draggable from 'vuedraggable';
import VuexStore from './store';
import ElementUI from 'element-ui';
import locale from 'element-ui/lib/locale/lang/fr';
import VueDRR from 'vue-drag-resize-rotate';
import axios from 'axios';
import VueTouch from 'vue-touch'
import lightbox from 'vlightbox';
import io from 'socket.io';
import { ObserveVisibility } from 'vue-observe-visibility'




window.Vue = Vue;


Vue.use(lightbox);
Vue.use(VueRouter);
Vue.use(Vuex);
Vue.directive('observe-visibility', ObserveVisibility)
Vue.use(ElementUI, { locale });
Vue.use(VueTouch, { name: 'v-touch' })

window.axios = axios;


/**
 * We'll load the axios HTTP library which allows us to easily issue requests
 * to our Laravel back-end. This library automatically handles sending the
 * CSRF token as a header based on the value of the "XSRF" token cookie.
 */




window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';


window.axios.interceptors.response.use((response) => { // intercept the global error
    return response
}, function (error) {
  let originalRequest = error.config
  if ((error.response.status === 401 || error.response.status === 419) && !originalRequest._retry ) { // if the error is 401 and hasent already been retried
    originalRequest._retry = true // now it can be retried
    window.location.href = '/login?alert=3'
  }
  if (error.response.status === 404 && !originalRequest._retry) {
    originalRequest._retry = true
    window.location.href = '/'
    return
  }
  // Do something with response error
  return Promise.reject(error)
})


/**
 * Next we will register the CSRF Token as a common header with Axios so that
 * all outgoing HTTP requests automatically have it attached. This is just
 * a simple convenience so we don't have to attach every token manually.
 */

let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

/**
 * Echo exposes an expressive API for subscribing to channels and listening
 * for events that are broadcast by Laravel. Echo and event broadcasting
 * allows your team to easily build robust real-time web applications.
 */

import Echo from 'laravel-echo'


window.io = require('socket.io-client');

// window.Pusher = require('pusher-js');

window.Echo = new Echo({
  authEndpoint : window.location.hostname+':8888/public/broadcasting/auth',
  broadcaster: 'socket.io',
  host: window.location.hostname + ':3000'
});

I also added a .babelrc file with this code inside :

{
  "presets": ["env"],
  "plugins": ["transform-vue-jsx"]
}

But none of this changes had helped the application. It still shows the same error on IE.

In safari i also get an error : "SyntaxError: Unexpected keyword 'const'. Const declarations are not supported in strict mode." on :

const safeBuffer = __webpack_require__(5);

also in my app.js file.

This is my package.json :

{
  "private": true,
  "scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.18",
    "babel-cli": "^6.26.0",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-vue-jsx": "^3.7.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-es2015-node6": "^0.4.0",
    "babel-preset-stage-0": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "bootstrap": "^4.1.1",
    "cross-env": "^5.2.0",
    "jquery": "^3.2",
    "laravel-mix": "^2.0",
    "lodash": "^4.17.4",
    "popper.js": "^1.12",
    "vue": "^2.5.7",
    "webpack-dev-server": "^3.1.6"
  },
  "dependencies": {
    "@babel/polyfill": "^7.0.0-beta.51",
    "babel-polyfill": "^6.26.0",
    "element-ui": "^2.4.2",
    "es6-promise": "^4.2.4",
    "express": "^4.15.2",
    "fs": "0.0.1-security",
    "joi-browser": "^13.4.0",
    "jquery-ui": "^1.12.1",
    "laravel-echo": "^1.4.0",
    "moment": "^2.22.2",
    "moment-timezone": "^0.5.21",
    "node-sass": "^4.9.0",
    "socket.io": "^2.1.1",
    "socketio": "^1.0.0",
    "utf-8-validate": "^4.0.2",
    "uws": "^9.14.0",
    "vlightbox": "^2.0.2",
    "vue-breadcrumbs": "^1.1.2",
    "vue-drag-resize-rotate": "^2.0.8",
    "vue-draggable-resizable": "^1.5.1",
    "vue-observe-visibility": "^0.3.1",
    "vue-router": "^3.0.1",
    "vue-socket.io": "^2.1.1",
    "vue-sortable": "^0.1.3",
    "vue-touch": "^2.0.0-beta.4",
    "vue2-dropzone": "^2.3.6",
    "vuedraggable": "^2.14.1",
    "vuex": "^3.0.0"
  },
  "optionalDependencies": {
    "bufferutil": "^3.0.5"
  }
}

and this is my composer.json :

{
    "name": "laravel/laravel",
    "description": "The Laravel Framework.",
    "keywords": ["framework", "laravel"],
    "license": "MIT",
    "type": "project",
    "require": {
        "php": "^7.1.3",
        "bugsnag/bugsnag-laravel": "^2.0",
        "fideloper/proxy": "^4.0",
        "kodeine/laravel-meta": "dev-master",
        "laravel/framework": "5.6.*",
        "laravel/tinker": "^1.0",
        "predis/predis": "^1.1",
        "robbiep/cloudconvert-laravel": "2.*",
        "spatie/laravel-glide": "^3.2",
        "spatie/laravel-image-optimizer": "^1.1",
        "spatie/pdf-to-image": "^1.4"
    },
    "require-dev": {
        "filp/whoops": "^2.0",
        "fzaninotto/faker": "^1.4",
        "mockery/mockery": "^1.0",
        "nunomaduro/collision": "^2.0",
        "phpunit/phpunit": "^7.0"
    },
    "autoload": {
        "classmap": [
            "database/seeds",
            "database/factories"
        ],
        "files": [
            "app/helpers.php"
        ],
        "psr-4": {
            "App\": "app/"
        }
    },
    "autoload-dev": {
        "psr-4": {
            "Tests\": "tests/"
        }
    },
    "extra": {
        "laravel": {
            "dont-discover": [
            ]
        }
    },
    "scripts": {
        "post-root-package-install": [
            "@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
        ],
        "post-create-project-cmd": [
            "@php artisan key:generate"
        ],
        "post-autoload-dump": [
            "Illuminate\Foundation\ComposerScripts::postAutoloadDump",
            "@php artisan package:discover"
        ]
    },
    "config": {
        "preferred-install": "dist",
        "sort-packages": true,
        "optimize-autoloader": true
    },
    "minimum-stability": "dev",
    "prefer-stable": true
}

Any ideas of how i can resolve this problems?

Thanks

18 Jul
1 year ago

wigogeo left a reply on Error On Safari. White Blank Page

@bashy, no it's not. I already include the polyfill js and i still get the error.

wigogeo started a new conversation Error On Safari. White Blank Page

Hi,

i'm running an SPA with Laravel and Vue.

It's working fine on Chrome and Firefox but not on Safari. I get this error : SyntaxError: Strict mode does not allow function declarations in a lexically nested statement.

The error is in this function :

/**

  • JSONP handler
  • Options:
    • param {String} qs parameter (callback)
    • prefix {String} qs parameter (__jp)
    • name {String} qs parameter (prefix + incr)
    • timeout {Number} how long after a timeout error is emitted (60000)
  • @param {String} url
  • @param {Object|Function} optional options / callback */

function jsonp(opts) { var prefix = opts.prefix || '__jp';

// use the callback name that was passed if one was provided. // otherwise generate a unique name by incrementing our counter. var id = opts.name || prefix + count++;

var timeout = opts.timeout || 60000; var cacheFlag = opts.cache || false; var enc = encodeURIComponent; var target = document.getElementsByTagName('script')[0] || document.head; var script; var timer; if (!opts.url) { throw new TypeError('url is null or not defined'); } /* eslint-disable */ return new Promise(function(resolve, reject) { try {

        function cleanup() {  //********* THE ERROR SEND ME RIGHT INTO THIS LINE *****//
            

if (script.parentNode) script.parentNode.removeChild(script); window[id] = noop; if (timer) clearTimeout(timer); } if (timeout) { timer = setTimeout(function() { cleanup(); reject(new Error('Request timed out')); }, timeout); }

        window[id] = function(data) {
            cleanup();
            resolve(data);
        };

        // add params
        opts.url = buildURL(opts.url, opts.params, opts.paramsSerializer);
        //add callback
        opts.url +=
            (opts.url.indexOf('?') === -1 ? '?' : '&') +
            'callback=' +
            enc(id);
        // cache
        !cacheFlag && (opts.url += '&_=' + new Date().getTime());

        // create script
        script = document.createElement('script');
        script.src = opts.url;
        target.parentNode.insertBefore(script, target);
    } catch (e) {
        reject(e);
    }
});

}

module.exports = jsonp;

Does someone has an idea to fix this error ?

Thanks