本文整理汇总了TypeScript中autoprefixer类的典型用法代码示例。如果您正苦于以下问题：TypeScript autoprefixer类的具体用法？TypeScript autoprefixer怎么用？TypeScript autoprefixer使用的例子？那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了autoprefixer类的10个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。
示例1:
plugins: () => [autoprefixer(
{
browsers: ['iOS >= 7', 'Android >= 4.1',
'last 10 Chrome versions', 'last 10 Firefox versions',
'Safari >= 6', 'ie > 8'],
},
)],
开发者ID:stefaniepei，项目名称:react-redux-scaffold，代码行数:7，代码来源:webpack.client.ts
示例2: 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
示例3: function
export const getPostcssPlugins = function (config) {
const designWidth = config.designWidth || 750
const useModuleConf = config.module || {}
const customPostcssConf = useModuleConf.postcss || {}
const customAutoprefixerConf = customPostcssConf.autoprefixer || {}
const customPxtransformConf = customPostcssConf.pxtransform || {}
const customPlugins = customPostcssConf.plugins || []
const postcssPxtransformOption = {
designWidth,
platform: 'h5'
}
const DEVICE_RATIO = 'deviceRatio'
if (config.hasOwnProperty(DEVICE_RATIO)) {
postcssPxtransformOption[DEVICE_RATIO] = config.deviceRatio
}
if (isEmptyObject(customAutoprefixerConf) || customAutoprefixerConf.enable) {
plugins.push(autoprefixer(Object.assign({}, defaultAutoprefixerConf, customAutoprefixerConf)))
}
plugins.push(pxtransform(Object.assign({}, postcssPxtransformOption, customPxtransformConf)))
plugins.push(constparse({
constants: [{
key: 'taro-tabbar-height',
val: '50PX'
}],
platform: 'h5'
}))
return plugins.concat(customPlugins)
}
开发者ID:ApolloRobot，项目名称:taro，代码行数:34，代码来源:postcss.conf.ts
示例4: processCSS
export default function processCSS() {
let processors = [
autoprefixer({browsers: ['last 1 version']})
];
return gulp.src(project.cssProcessor.source)
.pipe(changedInPlace({firstPass:true}))
.pipe(sourcemaps.init())
.pipe(postcss(processors))
.pipe(build.bundle());
};
开发者ID:AshleyGrant，项目名称:cli，代码行数:11，代码来源:process-css.ts
示例5: buildStyles
export default function buildStyles() {
let processors = [
autoprefixer({browsers: ['last 1 version']})
];
return gulp.src(project.paths.styles)
.pipe(changed(project.paths.output, {extension: '.css'}))
.pipe(sourcemaps.init())
.pipe(postcss(processors))
.pipe(sourcemaps.write())
.pipe(gulp.dest(project.paths.output));
};
开发者ID:itainteasy，项目名称:cli，代码行数:12，代码来源:build-styles-postcss.ts
示例6: function
export const getPostcssPlugins = function ({
designWidth,
deviceRatio,
postcssOption = {} as PostcssOption
}) {
if (designWidth) {
defaultPxtransformOption.config.designWidth = designWidth
}
if (deviceRatio) {
defaultPxtransformOption.config.deviceRatio = deviceRatio
}
const autoprefixerOption = recursiveMerge({}, defaultAutoprefixerOption, postcssOption.autoprefixer)
const pxtransformOption = recursiveMerge({}, defaultPxtransformOption, postcssOption.pxtransform)
// const cssModulesOption = recursiveMerge({}, defaultCssModulesOption, postcssOption.cssModules)
if (autoprefixerOption.enable) {
plugins.push(autoprefixer(autoprefixerOption.config))
}
if (pxtransformOption.enable) {
plugins.push(pxtransform(pxtransformOption.config))
}
// if (cssModulesOption.enable) {
// plugins.push(modules(cssModulesOption.config))
// }
plugins.push(constparse(defaultConstparseOption))
Object.entries(postcssOption).forEach(([pluginName, pluginOption]) => {
if (optionsWithDefaults.indexOf(pluginName) > -1) return
if (!pluginOption || !pluginOption.enable) return
if (!isNpmPackage(pluginName)) { // local plugin
pluginName = path.join(appPath, pluginName)
}
try {
const pluginPath = resolveSync(pluginName, { basedir: appPath })
plugins.push(require(pluginPath)(pluginOption.config || {}))
} catch (e) {
const msg = e.code === 'MODULE_NOT_FOUND' ? `缺少postcss插件${pluginName}, 已忽略` : e
console.log(msg)
}
})
return plugins
}
开发者ID:YangShaoQun，项目名称:taro，代码行数:51，代码来源:postcss.conf.ts
示例7: 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
示例8: autoprefixer
plugins: () => [
autoprefixer({
flexbox: 'no-2009',
}),
],
开发者ID:sutarmin，项目名称:dx-platform，代码行数:5，代码来源:loaders.ts
示例9: processStyleWithPostCSS
async function processStyleWithPostCSS (styleObj: IStyleObj): Promise<string> {
const { appPath, projectConfig, npmConfig, isProduction, buildAdapter } = 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]'
}
}, customPostcssConf.cssModules || {})
const customPxtransformConf = Object.assign({
enable: true,
config: {}
}, customPostcssConf.pxtransform || {})
const customUrlConf = Object.assign({
enable: true,
config: {
limit: 10240
}
}, customPostcssConf.url || {})
const customAutoprefixerConf = Object.assign({
enable: true,
config: {
browsers: browserList
}
}, customPostcssConf.autoprefixer || {})
const postcssPxtransformOption = {
designWidth: projectConfig.designWidth || 750,
platform: 'weapp'
}
if (projectConfig.hasOwnProperty(DEVICE_RATIO_NAME)) {
postcssPxtransformOption[DEVICE_RATIO_NAME] = projectConfig.deviceRatio
}
const cssUrlConf = Object.assign({ limit: 10240 }, customUrlConf)
const maxSize = Math.round((customUrlConf.config.limit || cssUrlConf.limit) / 1024)
const postcssPxtransformConf = Object.assign({}, postcssPxtransformOption, customPxtransformConf, customPxtransformConf.config)
const processors: any[] = []
if (customAutoprefixerConf.enable) {
processors.push(autoprefixer(customAutoprefixerConf.config))
}
if (customPxtransformConf.enable && buildAdapter !== BUILD_TYPES.QUICKAPP) {
processors.push(pxtransform(postcssPxtransformConf))
}
if (cssUrlConf.enable) {
const cssUrlParseConf = {
url: 'inline',
maxSize,
encodeType: 'base64'
}
processors.push(cssUrlParse(cssUrlConf.config.basePath ? Object.assign(cssUrlParseConf, {
basePath: cssUrlConf.config.basePath
}) : cssUrlParseConf))
}
const defaultPostCSSPluginNames = ['autoprefixer', 'pxtransform', 'url', 'cssModules']
Object.keys(customPostcssConf).forEach(pluginName => {
if (defaultPostCSSPluginNames.indexOf(pluginName) < 0) {
const pluginConf = customPostcssConf[pluginName]
if (pluginConf && pluginConf.enable) {
if (!isNpmPkg(pluginName)) { // local plugin
pluginName = path.join(appPath, pluginName)
}
processors.push(require(resolveNpmPkgMainPath(pluginName, isProduction, npmConfig, buildAdapter, appPath))(pluginConf.config || {}))
}
}
})
let css = styleObj.css
if (customCssModulesConf.enable) {
css = processStyleUseCssModule(styleObj).css
}
const postcssResult = await postcss(processors).process(css, {
from: styleObj.filePath
})
return postcssResult.css
}
开发者ID:YangShaoQun，项目名称:taro，代码行数:77，代码来源:compileStyle.ts
示例10: Autoprefixer
plugins: () => [
Autoprefixer(),
CssNano()
]
开发者ID:katallaxie，项目名称:katallaxie.github.com，代码行数:4，代码来源:default.ts
注：本文中的autoprefixer类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。 |
客服电话
APP下载
官方微信
请发表评论