本文整理汇总了TypeScript中postcss类的典型用法代码示例。如果您正苦于以下问题:TypeScript postcss类的具体用法?TypeScript postcss怎么用?TypeScript postcss使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了postcss类的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。
示例1: reject
}, (err, result) => {
if (err) {
return reject(`failed to compile ${file}: ${err}`);
}
const css = result.css.toString();
postcss([autoprefixer({browsers: ['last 2 versions']}), cssnano])
.process(css)
.then(postResult => {
postResult.warnings().forEach(warn => {
console.warn(warn.toString());
});
// do not write to file if output is identical to previous version
const productionCss = postResult.css.toString();
if (resourceChecksum.update(checksums, path.basename(outputFile), productionCss)) {
console.log(`[scss]:${file}`);
fs.writeFile(outputFile, productionCss, werr => {
if (werr) {
return reject(`faile to write css file: ${outputFile}: ${werr}`);
}
resolve(`${file} compiled`);
});
} else {
console.log(`[unchanged]:${file}`);
resolve(`${file} unchanged`);
}
});
});
开发者ID:cpylua,项目名称:cheli.im,代码行数:32,代码来源:styles.ts
示例2: postcss
})).then(results => {
let r = results[0].root;
for (let i = 1; i < results.length; i++) {
r = r.append(results[i].root);
}
return postcss([cssnano({ safe: true })]).process(r.toResult());
});
开发者ID:Bobris,项目名称:bobril-build,代码行数:7,代码来源:cssHelpers.ts
示例3: postCSS
/**
* @description 传入 css string ,返回 postCSS 处理后的 css string
* @param {string} css
* @param {string} filePath
* @param {object} projectConfig
* @returns {Function | any}
*/
function postCSS({css, filePath, projectConfig}) {
const pxTransformConfig = {
designWidth: projectConfig.designWidth || 750
}
if (projectConfig.hasOwnProperty(DEVICE_RATIO)) {
pxTransformConfig[DEVICE_RATIO] = projectConfig.deviceRatio
}
return postcss([
require('stylelint')(stylelintConfig),
require('postcss-reporter')({clearReportedMessages: true}),
pxtransform(
{
platform: 'rn',
...pxTransformConfig
}
)
])
.process(css, {from: filePath})
.then((result) => {
return {
css: result.css,
filePath
}
}).catch((e) => {
Util.printLog(processTypeEnum.ERROR, '样式转换', filePath)
console.log(e.stack)
})
}
开发者ID:YangShaoQun,项目名称:taro,代码行数:35,代码来源:styleProcess.ts
示例4: processCss
export function processCss(source: string, from: string, callback: (url: string, from: string) => string): PromiseLike<any> {
return postcss([postcssUrl({
url: (oldUrl: string, decl: any, from: string, dirname: string, to: string, options: any, result: any) => {
if (oldUrl.startsWith("data:")) return oldUrl;
return callback(oldUrl, from);
}
})]).process(source, { from });
}
开发者ID:Bobris,项目名称:bobril-build,代码行数:8,代码来源:cssHelpers.ts
示例5: autoprefix
function autoprefix(input: Buffer, options: AutoprefixOptions, callback: TransformCallback) {
const input_string = input.toString('utf8');
postcss([autoprefixer]).process(input_string).then(result => {
result.warnings().forEach(warning => console.warn(warning.toString()));
const output = new Buffer(result.css, 'utf8');
callback(null, output);
}, error => callback(error));
}
开发者ID:chbrown,项目名称:fapply,代码行数:8,代码来源:applicators.ts
示例6: postcss
export const processSync = ({
css,
filters,
postcssSyntax,
preserveLines,
}: IProcessOptions) => postcss(postcssSelectorExtract(filters, preserveLines))
.process(css, { syntax: postcssSyntax }).css
.replace(new RegExp(`\\/\\* ${PRESERVE_LINES_START}|${PRESERVE_LINES_END} \\*\\/`, `g`), ``);
开发者ID:Trevery,项目名称:blog,代码行数:8,代码来源:index.ts
示例7: styleUnitTransform
async styleUnitTransform (filePath: string, content: string) {
const postcssResult = await postcss([
unitTransform()
]).process(content, {
from: filePath
})
return postcssResult
}
开发者ID:YangShaoQun,项目名称:taro,代码行数:8,代码来源:index.ts
示例8: processStyleUseCssModule
export function processStyleUseCssModule (styleObj: IStyleObj): any {
const { projectConfig, appPath } = getBuildData()
const weappConf = Object.assign({}, projectConfig.weapp)
const useModuleConf = weappConf.module || {}
const customPostcssConf = useModuleConf.postcss || {}
const customCssModulesConf = Object.assign({
enable: false,
config: {
generateScopedName: '[name]__[local]___[hash:base64:5]',
namingPattern: 'global'
}
}, customPostcssConf.cssModules || {}) as ICSSModulesConf
if (!customCssModulesConf.enable) {
return styleObj
}
const namingPattern = customCssModulesConf.config.namingPattern
if (namingPattern === 'module') {
// 只对 xxx.module.[css|scss|less|styl] 等样式文件做处理
const DO_USE_CSS_MODULE_REGEX = /^(.*\.module).*\.(css|scss|less|styl)$/
if (!DO_USE_CSS_MODULE_REGEX.test(styleObj.filePath)) return styleObj
} else {
// 对 xxx.global.[css|scss|less|styl] 等样式文件不做处理
const DO_NOT_USE_CSS_MODULE_REGEX = /^(.*\.global).*\.(css|scss|less|styl)$/
if (DO_NOT_USE_CSS_MODULE_REGEX.test(styleObj.filePath)) return styleObj
}
const generateScopedName = customCssModulesConf.config.generateScopedName
const context = appPath
let scopedName
if (generateScopedName) {
scopedName = typeof generateScopedName === 'function'
? (local, filename) => generateScopedName(local, filename)
: genericNames(generateScopedName, { context })
} else {
scopedName = (local, filename) => Scope.generateScopedName(local, path.relative(context, filename))
}
const postcssPlugins = [
Values,
LocalByDefault,
ExtractImports,
new Scope({ generateScopedName: scopedName }),
new ResolveImports({ resolve: Object.assign({}, { extensions: CSS_EXT }) })
]
const runner = postcss(postcssPlugins)
const result = runner.process(styleObj.css, Object.assign({}, { from: styleObj.filePath }))
return result
}
开发者ID:YangShaoQun,项目名称:taro,代码行数:46,代码来源:compileStyle.ts
示例9: renderSassSuccess
function renderSassSuccess(context: BuildContext, sassResult: Result, sassConfig: SassConfig): Promise<string> {
if (sassConfig.autoprefixer) {
// with autoprefixer
let autoPrefixerMapOptions: any = false;
if (sassConfig.sourceMap) {
autoPrefixerMapOptions = {
inline: false
};
}
const postcssOptions: any = {
to: basename(sassConfig.outFile),
map: autoPrefixerMapOptions
};
Logger.debug(`sass, start postcss/autoprefixer`);
return postcss([autoprefixer(sassConfig.autoprefixer)])
.process(sassResult.css, postcssOptions).then((postCssResult: any) => {
postCssResult.warnings().forEach((warn: any) => {
Logger.warn(warn.toString());
});
let apMapResult: string = null;
if (sassConfig.sourceMap && postCssResult.map) {
Logger.debug(`sass, parse postCssResult.map`);
apMapResult = JSON.parse(postCssResult.map.toString()).mappings;
}
Logger.debug(`sass: postcss/autoprefixer completed`);
return writeOutput(context, sassConfig, postCssResult.css, apMapResult);
});
}
// without autoprefixer
generateSourceMaps(sassResult, sassConfig);
let sassMapResult: string = null;
if (sassResult.map) {
sassMapResult = JSON.parse(sassResult.map.toString()).mappings;
}
return writeOutput(context, sassConfig, sassResult.css.toString(), sassMapResult);
}
开发者ID:Kode-Kitchen,项目名称:ionic-app-scripts,代码行数:45,代码来源:sass.ts
示例10: url
import * as postcss from 'postcss';
import * as url from 'postcss-url';
const standard: postcss.Transformer = url();
const single: postcss.Transformer = url({ url: 'copy', assetsPath: 'img', useHash: true });
const multiple: postcss.Transformer = url([
{ filter: '**/assets/copy/*.png', url: 'copy', assetsPath: 'img', useHash: true },
{ filter: '**/assets/inline/*.svg', url: 'inline', optimizeSvgEncode: true },
{ filter: '**/assets/**/*.gif', url: 'rebase' },
{ filter: 'cdn/**/*', url: (asset) => `https://cdn.url/${asset.url}` },
]);
postcss().use(standard);
postcss().use(single);
postcss().use(multiple);
开发者ID:CNBoland,项目名称:DefinitelyTyped,代码行数:17,代码来源:postcss-url-tests.ts
注:本文中的postcss类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。 |
请发表评论