StealJS錯誤：跨起源請求不被支持的協議方案

Question

我有這樣的錯誤：

XMLHttpRequest cannot load file:///Users/mshin/workspace/spirent/trinity/trinity-link/public/node_modules/can/view/stache/system.js. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource. 

home.js：在Gruntfile

import can from 'can'; 
import template from './home.stache!'; 

export default can.Component.extend({ 
    tag: 'home', 
    template: template 
}); 

構建配置：

"steal-build": { 
    default: { 
    options: { 
     system: { 
     config: "package.json!npm", 
     bundlesPath: "production" 
     }, 
     buildOptions: { 
     minify: true, 
     sourceMaps: true 
     } 
    } 
    } 
} 

我不知道爲什麼我在生產模式下收到此錯誤消息。在開發環境中，它工作正常。另外，在測試環境上也不錯。我正在和被測試者一起運行QUnit測試。

home_test.js：

import QUnit from 'steal-qunit'; 
import ViewModel from 'components/home/home'; 
import can from 'can'; 
import stache from 'can/view/stache/'; 
import $ from 'jquery'; 

var template = can.stache('<home></home>'), 
    $component; 

QUnit.module('home component', { 
    setup: function() { 
    $('#trinity-js-tests').html(template()); 
    $component = $('#trinity-js-tests').find('home'); 
    } 
}); 

QUnit.test('title tag', function() { 
    QUnit.ok($component.find('h1'), 'Page shows title with <h1> tag'); 
}); 

QUnit.test('title content', function() { 
    QUnit.strictEqual($component.find('h1').text(), 'This is homepage.', 'Title is "This is homepage."'); 
}); 

但是，如果我改變home.js喜歡這個：

import can from 'can'; 

export default can.Component.extend({ 
    tag: 'home', 
    template: can.view('components/home/home.stache) 
}); 

它工作在生產和開發環境很好，但在測試的最後測試案件失敗。

1) QUnit "public/tests/test.html" on PhantomJS 1.9.8/Mac OS X 0.0.0: <a href="http://localhost:3996/public/tests/test.html?__token=k8l88m"></a> home component title content Title is "This is homepage.": 
    Error: Expected This is homepage. but was 
     at http://localhost:3996/public/tests/test.html?__token=k8l88m:1340 
     at http://localhost:3996/public/tests/test.html?__token=k8l88m:1907 
     at :33 
     at http://localhost:3996/public/tests/test.html?__token=k8l88m:895 
     at http://localhost:3996/public/tests/test.html?__token=k8l88m:1024 
     at process (http://localhost:3996/public/tests/test.html?__token=k8l88m:583) 
     at begin (http://localhost:3996/public/tests/test.html?__token=k8l88m:628) 
     at http://localhost:3996/public/tests/test.html?__token=k8l88m:644 

Answer 1

它看起來像你從文件加載它：//協議，是否正確？如果是這樣，那很可能是你的問題。

Answer 2

我發現我在代碼中遺漏了什麼。

main.js

import $ from 'jquery'; 
import _ from 'lodash'; 
import stache from 'can/view/stache/'; 
import can from 'can'; 
import 'components/route/'; 
import 'less/trinity.less!'; 

我沒有將它導入can/view/stache/system。 要使用can.stache中的系統插件，我需要將特定文件導入到主JavaScript文件。

因此，該文件應該是

import $ from 'jquery'; 
import _ from 'lodash'; 
import stache from 'can/view/stache/'; 
import 'can/view/stache/system'; // this is the added line 
import can from 'can'; 
import 'components/route/'; 
import 'less/trinity.less!';