Vue 2.x + Laravel 5.4가 Explorer에서 작동하지 않습니다.

Laravel 5.4 및 Vue 2 + Yarn으로 작성된 프로젝트에서 작업 중입니다. IE (버전 9-11)에서 다음 JS 오류가 발생합니다.Vue 2.x + Laravel 5.4가 Explorer에서 작동하지 않습니다.

속성 또는 메서드를 지원하지 않습니다

객체 'startsWith'

내가 무엇을 놓치고 (const를 화살표 기능의 사용이 선)

구문 오류? 나는 바벨을 잘못 사용하고 있는지, 아니면 뭔가 다른 것이 빠져 있는지 궁금합니다. Vue 2 구성 요소가 관련되어있을 때 Internet Explorer에서 제대로 작동하지 않는 이유를 계산할 때 이미 많은 시간을 보냈기 때문에 완전히 좌절했습니다. 어떤 도움이나 조언을 주시면 감사하겠습니다!

app.js :

require('./bootstrap'); 

var Promise = require('es6-promise').Promise; 
require('babel-polyfill') 
Promise.polyfill(); 
window.Vue = require('vue'); 
import Vue2Filters from 'vue2-filters' 
import BootstrapVue from 'bootstrap-vue'

내 webpack.mix.js 내가 해결을 위해 성공

{ 
    "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 --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", 
     "build": "babel src -d lib" 
    }, 
    "devDependencies": { 
     "accounting": "^0.4.1", 
     "axios": "^0.15.3", 
     "babel-cli": "^6.26.0", 
     "babel-core": "^6.26.0", 
     "babel-loader": "^7.1.2", 
     "babel-polyfill": "^6.26.0", 
     "babel-preset-env": "^1.6.1", 
     "babel-preset-vue-app": "^1.3.1", 
     "bootstrap-sass": "^3.3.7", 
     "cross-env": "^3.2.3", 
     "jquery": "^3.1.1", 
     "laravel-mix": "0.*", 
     "lodash": "^4.17.4", 
     "vue": "^2.4.2", 
     "vue-template-compiler": "^2.4.2", 
     "webpack": "^3.8.1" 
    }, 
    "dependencies": { 
     "bootstrap-vue": "^1.0.0-beta.7", 
     "es6-promise": "^4.1.1", 
     "vee-validate": "^2.0.0-beta.17", 
     "vue-events": "^3.0.1", 
     "vue-strap": "^1.1.37", 
     "vue2-filters": "^0.1.9", 
     "vuelidate": "^0.5.0" 
    } 
}

출처

2017-11-17 Yuval Kaufman

을 app.js IE와 AFAIK에서 Vue 앱을 사용하고 있습니다. Vue는 Promises polyfill 만 필요합니다. 그러나 화살표 기능을 사용하는 경우 올바른 바벨 설정을 사용하고 있는지 확인하십시오. 바벨 프리셋 -es2015-ie가 필요하다고 생각합니다. – WaldemarIce

['startsWith'] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith)는 IE에서 사용할 수 없으므로 polyfill해야합니다. 변환만으로는 누락 된 함수가 자동으로 채워지지 않으므로 구문을 변환 할 수 있습니다. – apokryfos

내 package.json

mix.js('resources/assets/js/app.js', 'public/js') 
    .sass('resources/assets/sass/app.scss', 'public/css') 
    .babel('out.es6.js', 'out.js') 
    .options({ 
     polyfills: [ 
      'Promise' 
    ] 
});

(바벨을 설치하려고) 바벨 코드를 실행하여 결과를 특정 위치에 표시하여 문제 :

내 .bashrc에 :

이

{ 
    "presets": ["es2015"] 
}

명령을 내가 대신 공공 /의 JS의 공공/JS/out.js 파일을 포함 레이아웃 파일에서 다음

./node_modules/.bin/babel public/js/app.js > public/js/out.js

이/

출처

2017-11-19 13:38:09

Vue 2.x + Laravel 5.4가 Explorer에서 작동하지 않습니다.

답변

관련 문제