2017-02-10 57 views
0

正在使用requiredjs。部署到任何环境(现在的本地截图)之后,会出现刷新问题。页面加载不正确。我检查了萤火虫的网络标签。其显示(下图)。当文件得到200 OK(BF Cache)状态时,页面加载不正常。从浏览器缓存中访问文件时需要JS Refress Issue

enter image description here

错误:

enter image description here

给Ctrl + F5

完所有页面来了正常。

​​

一段时间,我需要给很多CTRL + F5的则只有其工作asexpected

我requirejs配置文件:

require.config({ 
    baseUrl: "../../../../../../../Scripts", 
    //waitSecond: 0, 
    //urlArgs : "q="+new Date().getTime(), 
    enforcedefine: true, 
    paths: { 
     //RequireJS Plugins. 
     'text': 'lib/requirejs/text', 
     'domReady': 'lib/requirejs/domReady', 
     'app': 'app', 
     'noext': 'lib/requirejs/noext', 

     // Shared Libraries. 
     'jquery': 'lib/Kendo/jquery.min', 
     'jqueryMigrate': 'lib/jquery-migrate-1.2.1.min', 
     'jszip': 'lib/jszip', 
     'kendo': 'lib/Kendo/kendo.all.min', 
     'materialize': 'lib/materialize/materialize', 
     'jqueryValidate': 'jquery.validate.min', 
     'jsignature': 'lib/jSignature/jSignature.min', 
     'jqueryMaskedinput': 'lib/jquery/jquery.maskedinput.min', 
     'jqueryMd5': 'lib/jquery/jquery.md5', 
     'truckNotifier': 'Controls/serviceTruck.Notifier' 
    }, 
    shim: { 
     'app': { 
      deps: ['kendo'] 
     }, 
     'kendo': { 
      deps: ['jquery', 'jszip'], 
     }, 
     'jqueryExtensions': { 
      deps: ['jquery'], 
     }, 
     'materialize': { 
      deps: ['jquery', 'kendo'], 
     }, 
     'krossRespJs': { 
      deps: ['jquery'], 
     }, 
     'jqueryMaskedinput': { 
      deps: ['jquery'], 
     }, 
     'truckUploadSelector': { 
      deps: ['jquery'], 
     }, 
     'underscore': { 
      exports: '_' 
     } 
    } 
}); 

app.js文件:

(function (factory) { 
    if (typeof define === 'function' && define.amd) { 
     // AMD. Register as an anonymous module. 
     define([ 
      'domReady!', 
      'text', 
      'noext', 
      'jquery', 
      'kendo', 
      'jszip', 
      'truckNotifier' 
     ], factory); 
    } else { 
     // Browser globals 
     factory(jQuery); 
    } 
}(function (domReady,text,noext,$,kendo,jszip,truckNotifier) { 
    'use strict'; 
    var app = kendo.observable({ 
     // ---- PUBLIC FIELDS ---- 
     DATE_FORMAT: 'MM/dd/yyyy', 
     DATE_MASK: '99/99/9999', 
     DATE_TIME_FORMAT: 'MM/dd/yyyy HH:mm', 
     DATE_TIME_MASK: '99/99/9999 99:99', 
     PHONE_MASK: '(999) 999-9999', 
     TIME_FORMAT: 'HH:mm', 
     TIME_MASK: '99:99', 
     $notifier: $('#notify_container'), 
     router: new kendo.Router(), 
     isInitialized: false, 
     /** This call sets up background components of the current page. */ 

     initialize: function() { 
      var self = this; 
      // Initialize this first so it can show loading while the rest 
      // of this module loads. 

      if (!self.isInitialized) { 
       $('.link-external').attr('target', '_blank'); 

       $('#notify_container').serviceTruckNotifier(); 
       self.isInitialized = true; 
      } 

      window.JSZip = jszip; 

     }, 
     showPleaseWait: function (show) { 
     }, 
     /* Pops up a notification at the top of the page. */ 
     notify: function (type, message) { 
      var types = { 
       'push': 'notifyPush', 
       'info': 'notifyInfo', 
       'success': 'notifySuccess', 
       'error': 'notifyError', 
       'warn': 'notifyWarn', 
       'expired': 'notifyExpired' 
      }; 
      this.$notifier.serviceTruckNotifier(types[type], message); 
     } 
    }); 
    app.initialize(); 
    return app; 
})); 
在查看页面中使用

脚本:

<script> 
    require([ 
     'domReady!', 
     'text', 
     'noext', 
     'app', 
     'jquery', 
     'jqueryValidate', 
     'kendo', 
     'truckNotifier' 
    ], 
    function (
     domReady, 
     text, 
     noext, 
     app, 
     $, 
     jqueryValidate, 
     kendo, 
     truckNotifier 
     ) { 
     var notifier = $('#notify_container'), 
      message = '@(ViewBag.Message)'; 
     $("#primaryTextButton").kendoButton(); 
     $('.all-content').removeClass('dn'); 
     $('.mcenter').addClass('dn'); 
     if (message != "") { 
      notifier.serviceTruckNotifier("notifyExpired", "@C.LINK_HAS_BEEN_EXPIRED"); 
     } 
    }); 
</script> 

HTML文件:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>@ViewBag.Title</title> 
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /> 
    <meta name="viewport" content="width=device-width" /> 
    @Styles.Render("~/Content/Styles/all/css") 
    <script src="~/Scripts/lib/requirejs/require.js"></script> 
    <script src="~/Scripts/config.js"></script> 

</head> 
<body id="@RenderSection("BodyId", false)"> 
    @{ 
     System.Reflection.Assembly web = typeof(ServiceTruck.Web.Models.ExternalLogin).Assembly; 

     System.Reflection.Assembly assembly = System.Reflection.Assembly.GetExecutingAssembly(); 
     System.Diagnostics.FileVersionInfo fvi = System.Diagnostics.FileVersionInfo.GetVersionInfo(web.Location); 
     string version = fvi.FileVersion; 

     System.Reflection.AssemblyName webName = web.GetName(); 
     string myVersion = version.ToString(); 
     ViewBag.Version = myVersion; 
    } 

    @RenderSection("featured", required: false) 
    <section class="container-fluid"> 
     @RenderBody() 
    </section> 
    <!-- Service Truck Layout Footer Start --> 
    <footer class="copy-right"> 
     <div class="col-md-6 text-left"> 
      <p>All rights reserved.</p> 
      <p>Copyright © 2016 <a href="#">Name</a>.</p> 
     </div> 
     <div class="col-md-6 text-right"> 
      <p>Build @myVersion</p> 
      <p>Recommended Browsers: Internet Explorer 11, Firefox 48, Chrome 52</p> 
     </div> 
    </footer> 
    <!-- Service Truck Layout Footer End --> 
    @RenderSection("scripts", required: false) 

</body> 
</html> 
+0

间歇性错误大部分时间是由于错误地配置RequireJS或由不良的启动顺序造成的。现在你的问题没有包含足够的信息来允许猜测什么是错误的。请编辑你的问题到[mcve]。特别是,您需要显示您的RequireJS配置以及如何启动代码加载('script'标记的顺序与HTML中相同)。 – Louis

+0

我已经更新了这个问题,你可以请检查一下。 –

+0

一个代码片段的标题为“文件”。好的,但是这是什么文件?您正在加载大量文件。此外,我之前的评论说:“你需要展示如何启动代码加载**(脚本标签的顺序与HTML中的相同)**”。 (强调添加。)您没有按照与HTML相同的顺序显示'script'标签。这很重要。这是开始你的应用程序的一部分。 – Louis

回答

0

有一点是肯定错了你的配置是shimapp

'app': { 
     deps: ['kendo'] 
    }, 

您的app模块是AMD模块:它称为define。所以你不能使用shim。设置shim对于无法从中受益的模块可能会导致未定义的行为。

我已经对此进行过实验并且从RequireJS的一个版本得到了不一致的结果。关键是为AMD模块设置shim没有定义的语义。

+0

我已经删除了'app'的依赖关系。仍然面临同样的问题 –