有一个问题,svg sprite除了gulp本身之外根本不可见。这是托管上的内容====> https://i.stack.imgur.com/N1Ko8.png
现在包含的gulp和一切正常===> https://i.stack.imgur.com/MRQ0j.png
将精灵添加到身体的脚本
;( function( window, document ) {
'use strict';
var file = 'img/symbols.svg',
revision = 1;
if( !document.createElementNS || !document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' ).createSVGRect )
return true;
var isLocalStorage = 'localStorage' in window && window[ 'localStorage' ] !== null,
request,
data,
insertIT = function()
{
document.body.insertAdjacentHTML( 'afterbegin', data );
},
insert = function()
{
if( document.body ) insertIT();
else document.addEventListener( 'DOMContentLoaded', insertIT );
};
if( isLocalStorage && localStorage.getItem( 'inlineSVGrev' ) == revision )
{
data = localStorage.getItem( 'inlineSVGdata' );
if( data )
{
insert();
return true;
}
}
try
{
request = new XMLHttpRequest();
request.open( 'GET', file, true );
request.onload = function()
{
if( request.status >= 200 && request.status < 400 )
{
data = request.responseText;
insert();
if( isLocalStorage )
{
localStorage.setItem( 'inlineSVGdata', data );
localStorage.setItem( 'inlineSVGrev', revision );
}
}
}
request.send();
}
catch( e ){}
}( window, document ) );
答案 0 :(得分:0)
您是否使用过调试语句来确保在服务器端获得正确的数据?
然后,你可以在这个js脚本中使用console.log将数据记录到控制台(或使用chrome javascript调试器和断点)。
我会确保您从服务器接收正确的数据。如果服务器出现500错误,JS通常会停止执行(有时它会继续,但响应无效)。
此页面介绍了如何使用chrome调试器: