2017-05-15 1 views
1

J'ai un problème lors de l'exécution de l'application angular2 sur Safari 9.1.2. Toutes les autres versions supérieures fonctionnent. Voici mon erreur rien dire: enter image description hereAngular2 ne fonctionne pas sur Safari 9.1.2

Mon package.json

{ 
    "name": "xxxxxx-client", 
    "version": "1.0.0", 
    "description": "Client app", 
    "main": "index.js", 
    "repository": { 
    "type": "git", 
    "url": "xxxxxxx" 
    }, 
    "engines": { 
    "node": "6.9.2", 
    "npm": "3.10.9" 
    }, 
    "scripts": { 
    "dev_build": "node --max_old_space_size=8192 ./node_modules/webpack/bin/webpack.js --config ./config/webpack-dev.config.js", 
    "build": "node --max_old_space_size=8192 ./node_modules/webpack/bin/webpack.js --config ./config/webpack-prod.config.js", 
    "postbuild": "rollup --config ./config/rollup.config.js", 
    "build_dev": "npm run dev_build && npm start", 
    "build_prod": "npm run build && npm run postbuild", 
    "start": "node app.js" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/animations": "*", 
    "@angular/common": "^2.4.3", 
    "@angular/compiler": "^2.4.3", 
    "@angular/core": "^2.4.3", 
    "@angular/forms": "^2.4.3", 
    "@angular/http": "^2.4.3", 
    "@angular/platform-browser": "^2.4.3", 
    "@angular/platform-browser-dynamic": "^2.4.3", 
    "@angular/router": "^3.3.1", 
    "@mapbox/mapbox-gl-draw": "^0.16.1", 
    "@swimlane/ngx-charts": "4.0.0", 
    "@types/es6-shim": "^0.31.32", 
    "@types/geojson": "1.0.0", 
    "@types/mapbox-gl": "^0.30.0", 
    "@types/pusher-js": "*", 
    "@types/turf": "^3.5.32", 
    "angular2-cool-storage": "^3.0.1", 
    "angular2-jwt": "^0.1.28", 
    "animate.css": "^3.5.2", 
    "d3-array": "*", 
    "d3-brush": "*", 
    "d3-collection": "*", 
    "d3-color": "*", 
    "d3-dispatch": "*", 
    "d3-drag": "*", 
    "d3-ease": "*", 
    "d3-force": "*", 
    "d3-format": "*", 
    "d3-hierarchy": "*", 
    "d3-interpolate": "*", 
    "d3-path": "*", 
    "d3-quadtree": "*", 
    "d3-scale": "*", 
    "d3-selection": "*", 
    "d3-shape": "*", 
    "d3-time": "*", 
    "d3-time-format": "*", 
    "d3-timer": "*", 
    "d3-transition": "*", 
    "express": "4.13.x", 
    "font-awesome": "4.7.0", 
    "fs": "0.0.1-security",  
    "https": "^1.0.0", 
    "luxbar": "^0.3.2", 
    "mapbox-gl": "0.32.1", 
    "material-design-icons": "^3.0.1", 
    "material-design-lite": "^1.3.0", 
    "moment": "^2.17.1", 
    "ng2-data-table": "^1.0.0", 
    "ng2-page-slider": "^0.9.0", 
    "ng2-smart-table": "^0.6.0-1", 
    "ng2-table": "^1.3.2", 
    "ng2-toasty": "2.5.0", 
    "primeng": "^2.0.6", 
    "primeui": "^3.0.2", 
    "pusher-js": "^3.0.0", 
    "reflect-metadata": "^0.1.10", 
    "rxjs": "5.2.0", 
    "script-ext-html-webpack-plugin": "^1.7.1", 
    "turf": "3.0.14", 
    "underscore": "1.8.3", 
    "webpack-cleanup-plugin": "^0.5.1", 
    "zone.js": "^0.7.2" 
    }, 
    "devDependencies": { 
    "@vimeo/player": "^2.0.1", 
    "awesome-typescript-loader": "^3.1.3", 
    "compression-webpack-plugin": "^0.4.0", 
    "css-loader": "^0.27.3", 
    "extract-text-webpack-plugin": "^2.1.0", 
    "file-loader": "^0.10.1", 
    "html-webpack-plugin": "^2.28.0", 
    "json-loader": "^0.5.4", 
    "optimize-js-plugin": "0.0.4", 
    "postcss-loader": "^1.3.3", 
    "raw-loader": "^0.5.1", 
    "rollup": "^0.41.6", 
    "rollup-plugin-commonjs": "^8.0.2", 
    "rollup-plugin-node-globals": "^1.1.0", 
    "rollup-plugin-node-resolve": "^3.0.0", 
    "rollup-plugin-uglify": "^1.0.2", 
    "style-loader": "^0.16.0", 
    "stylus": "^0.54.5", 
    "stylus-loader": "^3.0.1", 
    "to-string-loader": "^1.1.5", 
    "transform-loader": "^0.2.4", 
    "ts-loader": "^2.0.3", 
    "tslint": "^4.5.1", 
    "tslint-loader": "^3.4.3", 
    "typescript": "^2.2.1", 
    "url-loader": "^0.5.8", 
    "webpack": "^2.3.3", 
    "webpack-dev-server": "^2.4.2", 
    "webpack-sources": "^0.2.3", 
    "webworkify-webpack": "^2.0.4" 
    } 
} 

Nous avons testé notre application sur tous les navigateurs -> Chrome 48,49,50+, Firefox 49,50+, Safari 10 +, Opera, Edge, etc. Tout fonctionne correctement, sauf Safari 9.1.2. Aucun conseil?

EDIT

ligne mise au point par ligne, voici ce que débogueur console affiche: Lors de l'ouverture _reportError Je vois ceci: enter image description here

Ouverture du _getDependenciesMetadata voir ceci: enter image description here

ouvrant le _getTypeMetadata voir ceci: enter image description here

ouverture du _loadDirectiveMetadata voir ceci: enter image description here

+0

Semble être un problème lors de la résolution DI pour un composant ou un service. Pouvez-vous déboguer dans ces lignes pour voir quand l'erreur se produit ce que sont exactement ces objets? –

+1

Également peut-être regarder dans les polyfills requis pour safari 9 - par exemple, je sais qu'il y avait quelques problèmes avec [pipes de date] (https://github.com/angular/angular-cli/issues/1675), mais peut-être vous manque autre chose. –

+0

cela ressemble à un problème d'injection - il s'agit très probablement d'une dépendance circulaire - ce qui signifie qu'un service injecte un autre service - alors que l'autre service fait de même. assurez-vous que vous n'avez pas une telle dépendance circulaire – mareks

Répondre

0

J'ai refondus mon code et rendu compte que le problème était vraiment, y compris la dépendance circulaire. Je devais garder mon code propre et simple et injecter DI seulement où c'est vraiment nécessaire et utiliser les meilleures pratiques comme l'héritage et l'injection globale