问题描述

RequireJS跨域加载HTML模版失败，例如：
在a.com域名下请求CDN域名下的模版，text.js插件会把html文件转成html.js文件去加载，由于并没有生成html.js文件，所以会404

问题原因

  • 打包后部分HTML模版无法内联，原因是同一模块引入的路径不一致
  • 通过XHR请求HTML模版，浏览器同源策略，无法跨域

解决方案

  • 打包后内联HTML模版，无需异步加载HTML文件，需要正确配置模版引用否则无法打包成内联模版，打包配置默认是内联模版
  • 打包后生产模版的JS文件，即会生成一个模版的html.js文件，里面定义的是一个模块，返回html模版字符串，通过设置打包配置参数即可optimizeAllPluginResources: true。可以跨域解析，但产生大量冗余文件，可以单独上传，不好维护。

官方文档详细说明

https://github.com/requirejs/text

RequireJS跨域加载html模版后被转成JS问题分析及解决的更多相关文章

  1. jquery mobile 和phonegap开发总结之三跨域加载页面

    跨域加载 一要进行一定的配置见下面 $( document ).bind( "mobileinit", function() { // Make your jQuery Mobil ...

  2. jquery中ajax跨域加载

    今天学习ajax跨域加载,先来一段代码,异步加载的链接是爱奇艺的开源,我直接拿来用作测试 <!DOCTYPE html> <html lang="en"> ...

  3. chrome浏览器下用jQuery的load函数来跨域加载页面，响应状态status为(canceled)是什么情况？ JSON和JSONP，也许你会豁然开朗，含jQuery用例

    http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 问题来源:http://q.cnblogs.com ...

  4. pdf.js跨域加载文件

    pdf.js一个基于Html的工具类,熟悉pdf.js的朋友们很清楚,pdf.js帮助我们做了很多事.尤其金融类网站会产生很多的报表.需要在线预览.pdf.js绝对是我们的首选 本地预览 在pdf.j ...

  5. JQuery和原生JS跨域加载JSON数据或HTML。

    前提:有时候需要在网页上,加载另一个网站上的数据.或者加载另一个网站上的一个页面.Js的Ajax请求不具备跨域功能,可以使用JQuery来实现. 网页端JS代码: $(function () { $. ...

  6. script通过script标签跨域加载数据

    /********************************************************** 说明:跨域请求数据Javascript组件 ------------------ ...

  7. flash 跨域加载 二次加载

    var url2:String = "http://thirdapp0.qlogo.cn/qzopenapp/fa5d80ebf9fc89aaa1d7ddb0e1b861e58d77b409 ...

  8. requirejs：模块加载(require)及定义(define)时的路径小结

    原文地址:http://www.tuicool.com/articles/7JBnmy 接触过requirejs的童鞋可能都知道,无论是通过define来定义模块,还是通过require来加载模块,模 ...

  9. RequireJS 主入口加载模块经常会加载失败的问题

    在接入requirejs时,在main入口遇到了这样的问题,使用jquery,刷新10次页面会有3-4次加载失败,找不到$符号等等 require.config({ 'baseUrl': './mod ...

随机推荐

  1. Nginx和apache服务器中php运行方式

    PHP5的CGI方式的一大优势是内置了FastCGI的支持,只需指明绑定的地址和端口参数便可以以FastCGI的方式运行,如下: php-cgi -b 127.0.0.1:9000 配置Nginx的P ...

  2. MySQL(介绍，安装，密码操作，权限表)

    一.数据库介绍1.数据库相关概念 a.支持并发     b.锁的问题     c.对客户端请求进行认证     d.存取效率(降低IO次数)    数据库服务器(本质就是一个台计算机,该计算机之上安装 ...

  3. 弹出框sweetalert插件的简单使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Scientific Toolworks Understand

    Scientific Toolworks Understand是一款定位于代码阅读的软件.界面用Qt开发的. 软件特性: 1.支持多语言:Ada, C, C++, C#, Java, FORTRAN, ...

  5. Android中验证输入是否为汉字、手机号及邮箱

    1,验证是否为汉字 Code// 验证昵称 private boolean verifyNickname() { String nickname = edt_username.getText().to ...

  6. 硬盘性能测试工具fio

    如何衡量云硬盘的性能 IOPS:每秒读/写次数,单位为次(计数).存储设备的底层驱动类型决定了不同的 IOPS. 吞吐量:每秒的读写数据量,单位为MB/s. 时延:IO操作的发送时间到接收确认所经过的 ...

  7. 使用SimHash进行海量文本去重[转]

    阅读目录 1. SimHash与传统hash函数的区别 2. SimHash算法思想 3. SimHash流程实现 4. SimHash签名距离计算 5. SimHash存储和索引 6. SimHas ...

  8. Android应用开发中三种常见的图片压缩方法

    Android应用开发中三种常见的图片压缩方法,分别是:质量压缩法.比例压缩法(根据路径获取图片并压缩)和比例压缩法(根据Bitmap图片压缩). 一.质量压缩法 private Bitmap com ...

  9. 【进阶2-2期】JavaScript深入之从作用域链理解闭包（转）

    这是我在公众号(高级前端进阶)看到的文章,现在做笔记   https://github.com/yygmind/blog/issues/18 红宝书(p178)上对于闭包的定义:闭包是指有权访问另外一 ...

  10. dell g3：安装ubuntu16.04 + CUDA8.0

    一.Ubuntu 1.选择UEFI模式启动,参考https://blog.csdn.net/qq_34570910/article/details/78084659 2.卡在logo界面进不去,在qu ...