问题描述

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. MinGW GCC 7.1.0 2017年6月份出炉啦

    MSYS_MinGW-w64_GCC_710_x86-x64_Full.7z 发布日期: 2017-06-03 18:33 69.4M 下载地址: http://xhmikosr.1f0.de/too ...

  2. MySQL--表操作(innodb表字段数据类型、约束条件)、sql_mode操作

    一.创建表的完整语法 #[]内的可有可无,即创建表时字段名和类型是必须填写的,宽度与约束条件是可选择填写的.create table 表名(字段名1 类型[(宽度) 约束条件],字段名2 类型[(宽度 ...

  3. bootstrap4简单使用和入门01-简单表单的使用

    基本表单页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  4. vue与jquery合作

    2017年2月26日 14:59:34 星期日 场景: jquery的$.post, $.get是$.ajax的封装, 是异步的 因此, 有肯能在初始化vue实例的时候, 异步请求的结果还没返回, 这 ...

  5. CF D. One-Dimensional Battle Ships

    一个set水 + 区间判断个数问题.... #include<iostream> #include<cstdio> #include<cstring> #inclu ...

  6. 文本内容查找grep、文件查找find、正则匹配

    一.文本内容查找工具 grep grep   egrep (文本过滤)   fgrep (不支持正则) 对文本的内容按照指定的匹配模式基于行来进行筛选 格式     grep [选项] 模式 文件 选 ...

  7. sql拼接显示table的多个列

    SELECT DeptName AS text,CONVERT(VARCHAR(10),ID)+','+DeptCode+','+ISNULL(Remark,'') AS tags,'' AS hre ...

  8. python基础--管理目录与文件

    1) 文件夹 os.listdir() #显示文件夹下所有文件 os.getcwd() #获取当前工作目录 os.chdir() #切换目录 os.mkdir() #建立目录 os.path.exis ...

  9. 对象Object

    功能分类                       1. 创建对象 把各对数自身拥有的可枚举属性复制到第一个对象并返回:obj = Object.assign(o1, o2, o3),o1=obj ...

  10. Linux 上的 SQL Server 2017 的安装指南

    一:介绍背景 微软在2016年 3 月首次对外宣布了 Linux 版的 SQL Server,并于2017年 7 月发布了首个公开 RC 版.前几日在美国奥兰多召开的微软 Ignite 2017 大会 ...