//>>excludeStart('excludeRequireCss', pragmas.excludeRequireCss)
/*
* css.normalize.js
*
* CSS Normalization
*
* CSS paths are normalized based on an optional basePath and the RequireJS config
*
* Usage:
* normalize(css, fromBasePath, toBasePath);
*
* css: the stylesheet content to normalize
* fromBasePath: the absolute base path of the css relative to any root (but without ../ backtracking)
* toBasePath: the absolute new base path of the css relative to the same root
*
* Absolute dependencies are left untouched.
*
* Urls in the CSS are picked up by regular expressions.
* These will catch all statements of the form:
*
* url(*)
* url('*')
* url("*")
*
* @import '*'
* @import "*"
*
* (and so also @import url(*) variations)
*
* For urls needing normalization
*
*/
define(function() {
// regular expression for removing double slashes
// eg http://www.example.com//my///url/here -> http://www.example.com/my/url/here
var slashes = /([^:])\/+/g
var removeDoubleSlashes = function(uri) {
return uri.replace(slashes, '$1/');
}
// given a relative URI, and two absolute base URIs, convert it from one base to another
var protocolRegEx = /[^\:\/]*:\/\/([^\/])*/;
var absUrlRegEx = /^(\/|data:)/;
function convertURIBase(uri, fromBase, toBase) {
if (uri.match(absUrlRegEx) || uri.match(protocolRegEx))
return uri;
uri = removeDoubleSlashes(uri);
// if toBase specifies a protocol path, ensure this is the same protocol as fromBase, if not
// use absolute path at fromBase
var toBaseProtocol = toBase.match(protocolRegEx);
var fromBaseProtocol = fromBase.match(protocolRegEx);
if (fromBaseProtocol && (!toBaseProtocol || toBaseProtocol[1] != fromBaseProtocol[1] || toBaseProtocol[2] != fromBaseProtocol[2]))
return absoluteURI(uri, fromBase);
else {
return relativeURI(absoluteURI(uri, fromBase), toBase);
}
};
// given a relative URI, calculate the absolute URI
function absoluteURI(uri, base) {
if (uri.substr(0, 2) == './')
uri = uri.substr(2);
// absolute urls are left in tact
if (uri.match(absUrlRegEx) || uri.match(protocolRegEx))
return uri;
var baseParts = base.split('/');
var uriParts = uri.split('/');
baseParts.pop();
while (curPart = uriParts.shift())
if (curPart == '..')
baseParts.pop();
else
baseParts.push(curPart);
return baseParts.join('/');
};
// given an absolute URI, calculate the relative URI
function relativeURI(uri, base) {
// reduce base and uri strings to just their difference string
var baseParts = base.split('/');
baseParts.pop();
base = baseParts.join('/') + '/';
i = 0;
while (base.substr(i, 1) == uri.substr(i, 1))
i++;
while (base.substr(i, 1) != '/')
i--;
base = base.substr(i + 1);
uri = uri.substr(i + 1);
// each base folder difference is thus a backtrack
baseParts = base.split('/');
var uriParts = uri.split('/');
out = '';
while (baseParts.shift())
out += '../';
// finally add uri parts
while (curPart = uriParts.shift())
out += curPart + '/';
return out.substr(0, out.length - 1);
};
var normalizeCSS = function(source, fromBase, toBase) {
fromBase = removeDoubleSlashes(fromBase);
toBase = removeDoubleSlashes(toBase);
var urlRegEx = /@import\s*("([^"]*)"|'([^']*)')|url\s*\((?!#)\s*(\s*"([^"]*)"|'([^']*)'|[^\)]*\s*)\s*\)/ig;
var result, url, source;
while (result = urlRegEx.exec(source)) {
url = result[3] || result[2] || result[5] || result[6] || result[4];
var newUrl;
newUrl = convertURIBase(url, fromBase, toBase);
var quoteLen = result[5] || result[6] ? 1 : 0;
source = source.substr(0, urlRegEx.lastIndex - url.length - quoteLen - 1) + newUrl + source.substr(urlRegEx.lastIndex - quoteLen - 1);
urlRegEx.lastIndex = urlRegEx.lastIndex + (newUrl.length - url.length);
}
return source;
};
normalizeCSS.convertURIBase = convertURIBase;
normalizeCSS.absoluteURI = absoluteURI;
normalizeCSS.relativeURI = relativeURI;
return normalizeCSS;
});
//>>excludeEnd('excludeRequireCss')
分享到:
相关推荐
样式标准化样式化CSS标准化库。 原始的normalize.css是从提取的,并解析为样式化的就绪格式。用法npm install --save styled... 用作组件: // index.jsimport React from 'react'import ReactDOM from 'react-dom'impo
Meteor 是一个全栈 JavaScript 开发框架,它允许开发者使用同一种语言进行后端、前端和数据库的开发。通过 `meteor-normalize`,开发者无需手动添加或管理 `normalize.css` 文件,只需将其添加为 Meteor 项目的依赖...
normalize:统一了基本的样式,如margin: 0;(类似compass中的reset模块) compass:对sass的封装,扩展 1.安装 npm i normalize.css compass-mixins –save-dev 1.1 normalize.cssx引用 在main.js中 import '...
link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css?3.1.64" rel="stylesheet"> <link href="demo/base.css?3.1.64" rel="stylesheet"> <link href="dist/srs.css...
`normalize.email.css`是专为电子邮件设计的一个CSS重置样式库,它的目标是提供一种标准化的环境,确保邮件在各种客户端上的显示效果更加一致。 `normalize.email.css` 的核心思想是对电子邮件中的常见元素应用一致...
Normalize.css 故事书 笑话与酵素 SEO和分析 开始吧 npm install 开发构建 # Development build with hot reloading npm run start:dev 生产建立 与服务器一起使用 # Build app for production npm install npm ...
在JavaScript开发中,尤其是在前端构建流程中,我们经常会将Normalize.css引入到项目中,以确保在JavaScript操作DOM元素时,元素的样式在所有支持的浏览器上表现一致。这有助于提升用户体验,减少由于浏览器差异带来...
为了克服这个问题,开发者通常会采用像FastClick、Tap.js等库,而“百度touch.js”则是另一个有效的解决方案。 百度touch.js是一个轻量级的JavaScript库,专为了解决移动端Web应用中的点击事件延迟问题。它通过监听...
Стэк:哈巴狗(jade),萨斯(scss),js。 Атакжеплюшки,вродеpostcss(autoprefixer,cssnano),通天塔Установка ТребуетсяустановленныйNode.js。 Кл...
ist的matlab代码 关于 字符串中的重音符号和不重音符号。 还可以将字符串初步转换为小写。 我们将其用于自动完成:两个都用于匹配的字符串-在服务器端进行索引时;...在网页中包含src/normalize.js
main.js 中引入 normalize.css 去除默认属性 assets/css/bsaa.css 引入 icon 配置路由: 创建 views 文件夹创建 login 登录页面 在 router/index.js 中引入 在 router[]里面配置 { path: "/", component: Layout, }...
在Node.js中,`path`模块提供了一系列与操作系统路径处理相关的函数,`path.normalize`是其中之一,用于规范化路径字符串,确保其符合特定操作系统的路径表示规则。本文将深入讲解`path.normalize`方法的使用说明、...
规范化.css v3 Normalize.css 是一个可定制的 CSS 文件,它使浏览器能够更一致地呈现所有元素并符合现代标准。 该项目依赖于研究默认浏览器样式之间的差异,以便仅精确定位需要或受益于规范化的样式。安装 : npm ...
import 'normalize.css/normalize.css' vue中约会字体-真棒 入口js中约会 npm npm install font-awesome --save 直接约会 import 'font-awesome/css/font-awesome.min.css' sass开发环境安装 npm i -D sass sass-...
4. **CSS Reset**:使用CSS Reset来消除不同浏览器之间的样式差异,如Eric Meyer Reset或 Normalize.css。 5. **JavaScript Polyfill**:某些新的JavaScript API在IE8中不可用,如Array的`forEach`方法,可能需要...
... fastclick.js 移动端快速点击框架 riot.js 1kb MVP 开发框架 ... 初始化normalize.less 主样式 vco.less ......视图层 内嵌到index.html里面包含所有视图 riot 提供了便捷快速的视图方式
随着WebGL技术的发展,JavaScript库Three.js为开发者提供了在浏览器中创建3D图形的强大工具。本篇文章将深入探讨如何使用Three.js来构建一个简单的塔防(TD)游戏——td-trial,让我们一起踏上这段探索之旅。 一、...
HTML5 和 CSS3 响应式设计标语和部分标题的 CSS3 过渡为高像素比屏幕交换图像用于创建 CSS 文件的 CSS 预处理器 (SCSS) 优化图像用于 IE8 的HTML5shiv.js 用于 IE8 的Respond.js 适用于 IE8,9 的CSS3 PIE Normalize....