2017-02-25 72 views
0

這可能是另一個問題初學者添加到青鳥項目奧裏利亞不起作用

我設置使用JavaScript的服務奧裏利亞SPA模板的項目。在IE11中運行此項目會引發未處理的運行時異常:「Promise」未定義。

http://localhost:54195/dist/app.js?v=eXMK1e2R-1iC7sDJ1TzKClbGOJAKb11N-KPl95g30Fg 0x800a1391在行1923年,第3列

未處理的異常 - Laufzeitfehler在JavaScript: 「無極」 IST undefiniert 發生

爲了解決這個我嘗試添加藍鳥庫作爲建議幾個職位。但我無法讓它運行。我總是有同樣的錯誤。顯然這個錯誤發生在aurelia-bootstrapp-webpack.js行36(function ready())。顯然藍鳥圖書館仍然沒有得到承認。以下是我迄今爲止:

webpack.config.js

​​

webpack.config.vendor.js

var isDevBuild = process.argv.indexOf('--env.prod') < 0; 
var path = require('path'); 
var webpack = require('webpack'); 
var ExtractTextPlugin = require('extract-text-webpack-plugin'); 
var extractCSS = new ExtractTextPlugin('vendor.css'); 

module.exports = { 
    resolve: { 
     extensions: [ '.js' ] 
    }, 
    module: { 
     loaders: [ 
      { test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' }, 
      { test: /\.css(\?|$)/, loader: extractCSS.extract(['css-loader']) } 
     ] 
    }, 
    entry: { 
     vendor: [ 
      'bluebird', 
      "jquery", 
      'aurelia-event-aggregator', 
      'aurelia-fetch-client', 
      'aurelia-framework', 
      'aurelia-history-browser', 
      'aurelia-logging-console', 
      'aurelia-pal-browser', 
      'aurelia-polyfills', 
      'aurelia-route-recognizer', 
      'aurelia-router', 
      'aurelia-templating-binding', 
      'aurelia-templating-resources', 
      'aurelia-templating-router', 
      "./semantic/dist/semantic.css", 
      "./semantic/dist/semantic.js" 
     ], 
    }, 
    output: { 
     path: path.join(__dirname, 'wwwroot', 'dist'), 
     publicPath: '/dist/', 
     filename: '[name].js', 
     library: '[name]_[hash]', 
    }, 
    plugins: [ 
     extractCSS, 
     new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable) 
     new webpack.DllPlugin({ 
      path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'), 
      name: '[name]_[hash]' 
     }) 
    ].concat(isDevBuild ? [] : [ 
     new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }) 
    ]) 
}; 

app.ts

import * as Bluebird from "bluebird"; 
Bluebird.config({ warnings: false }); 

import { Aurelia } from 'aurelia-framework'; 
import { Router, RouterConfiguration } from 'aurelia-router'; 


export class App { 
    router: Router; 

    configureRouter(config: RouterConfiguration, router: Router) { 
     config.title = 'Aurelia'; 
     config.map([{ 
      route: [ '', 'home' ], 
      name: 'home', 
      settings: { icon: 'home' }, 
      moduleId: '../home/home', 
      nav: true, 
      title: 'Home' 
     }, { 
      route: 'counter', 
      name: 'counter', 
      settings: { icon: 'education' }, 
      moduleId: '../counter/counter', 
      nav: true, 
      title: 'Counter' 
     }, { 
      route: 'fetch-data', 
      name: 'fetchdata', 
      settings: { icon: 'th-list' }, 
      moduleId: '../fetchdata/fetchdata', 
      nav: true, 
      title: 'Fetch data' 
     }]); 

     this.router = router; 
    } 
} 
+0

您必須在加載Aurelia之前加載Bluebird。加載'aurelia-bootstrapper'模塊之前。 –

+0

我完全同意。在app.ts中,這是我第一次參考。在供應商包中,這是我第一次參考。顯然我不知道如何控制模塊的加載順序......我確定我錯過了非常明顯的東西 –

+0

'app.ts'由'aurelia-bootstrapper'加載。你必須在所有這些之前加載Bluebird。在我們的CLI中,我們實際上將Bluebird添加到包的開頭。 –

回答

0

經過一番研究,我找到了一個解決方案。這是加入藍鳥的插件,webpack.config.js

plugins: [ 
    new webpack.ProvidePlugin({ Promise: "bluebird" }), 
    new webpack.DefinePlugin({ IS_DEV_BUILD: JSON.stringify(isDevBuild) }), 
    new webpack.DllReferencePlugin({ 
     context: __dirname, 
     manifest: require('./wwwroot/dist/vendor-manifest.json') 
    }), 
    new AureliaWebpackPlugin({ 
     root: path.resolve('./'), 
     src: path.resolve('./ClientApp'), 
     baseUrl: '/' 
    }) 
] 

的ProvidePlugin似乎藍鳥注入到每一個包。