javascript - 将 angular-ui-bootstrap 与 webpack 一起使用

Question

我尝试使用 https://github.com/angular-ui/bootstrap使用 Webpack:

import angular from 'angular';
import uiRouter from 'angular-ui-router';
import createComponent from './create.component';
import tabs from 'angular-ui-bootstrap/src/tabs/index';

let createModule = angular
    .module('create', [
        uiRouter,
        tabs
    ])
    .component('partnerCreate', createComponent);

export default createModule;

我在浏览器控制台中有一个错误:

angular.js:11881 XMLHttpRequest cannot load http://localhost:3300uib/template/tabs/tabset.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.(anonymous function) @ angular.js:11881sendReq @ angular.js:11642serverRequest @ angular.js:11352processQueue @ angular.js:16170(anonymous function) @ angular.js:16186$eval @ angular.js:17444$digest @ angular.js:17257$apply @ angular.js:17552bootstrapApply @ angular.js:1754invoke @ angular.js:4709doBootstrap @ angular.js:1752bootstrap @ angular.js:1772angularInit @ angular.js:1657(anonymous function) @ angular.js:31468i @ jquery.min.js:2fireWith @ jquery.min.js:2ready @ jquery.min.js:2K @ jquery.min.js:2
angular.js:13708 Error: [$compile:tpload] Failed to load template: uib/template/tabs/tabset.html (HTTP status: -1 )
http://errors.angularjs.org/1.5.7/$compile/tpload?p0=uib%2Ftemplate%2Ftabs%2Ftabset.html&p1=-1&p2=
    at angular.js:68
    at handleError (angular.js:19195)
    at processQueue (angular.js:16170)
    at angular.js:16186
    at Scope.$eval (angular.js:17444)
    at Scope.$digest (angular.js:17257)
    at Scope.$apply (angular.js:17552)
    at bootstrapApply (angular.js:1754)
    at Object.invoke (angular.js:4709)
    at doBootstrap (angular.js:1752)

这是我的 Webpack 加载器配置:

loaders: [
    {
        test: /\.js$/, 
        exclude: [/app\/lib/, /node_modules/], 
        loader: 'ng-annotate!babel',
    }, 
    {test: /\.jade$/, loader: 'jade'},
    {test: /\.json$/, loader: 'json'}, 
    {test: /\.less$/, loader: 'style!css!less'}, 
    {test: /\.css$/, loader: 'style!css'},
    {
        test: /\.(eot|woff|woff2|ttf|svg|png|jpg)(\?[a-z0-9=\.]+)?$/, 
        loader: 'url-loader?limit=30000&name=[name]-[hash].[ext]',
    } 
]

有人可以解释我做错了什么吗？

Answer 1

这里只是冒险猜测，但可能会在您的 XHR 请求的路由中添加一个前导斜线或检查您的代理设置(webpack 开发服务器或浏览器同步？)

angular.js:11881 XMLHttpRequest cannot load http://localhost:3300uib/template/...

不是有效的 URL...