当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript autoprefixer.default函数代码示例

本文整理汇总了TypeScript中autoprefixer.default函数的典型用法代码示例。如果您正苦于以下问题:TypeScript default函数的具体用法?TypeScript default怎么用?TypeScript default使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。


在下文中一共展示了default函数的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: sass

  return function sass(this: WebpackConfig): WebpackConfig {
    const loaders = ['style', `css${sourceMap ? '?sourceMap' : ''}`]

    if (resolveRelativeUrl) {
      loaders.push(`resolve-url${sourceMap ? '?sourceMap' : ''}`)
      sourceMap = true // source maps need to be on for this
    }

    /**
     *  postcss-loader https://github.com/postcss/postcss-loader
     *  NOTE: you will need to npm install the postcss plugin and then require it in your webpack.config.js
     *
     *  Why use postcss with Webpack and Sass? Webpack has many loaders that correspond to a postcss loader so check
     *  for a Webpack loader first, but postcss also has plugins that offer additional functionality.  Postcss plugins
     *  can also be easier to use and offer more functionality than a Sass mixin
     *
     *  NOTE: autoPrefixer  and postcssPlugins are mutually exclusive  -- if autoPrefixer = true then
     *  postcssPlugins array will not be used
     *
     *  postcssPlugins: Array of postcss plugins
     *  autoPrefixer: boolean defaults to false -- passes the AutoPrefixer plugin with preset values to postcss processor

     */
    let postcssLoaders
    if (autoPrefixer === true) {
      loaders.push('postcss-loader')
      postcssLoaders = [
          autoprefixer({ browsers: ['last 2 versions'] })]
    }else if (postcssPlugins instanceof Array && postcssPlugins.length > 0){
      loaders.push('postcss-loader')
      postcssLoaders = postcssPlugins
    }

    loaders.push(`sass${sourceMap ? '?sourceMap' : ''}`)

    const extractCss = extractText === false
    const providedInstance = extractText instanceof ExtractTextPlugin
    if (!providedInstance)
      extractText = extractCss ? new ExtractTextPlugin(filename, extractText instanceof Object ? extractText : { allChunks, sourceMap }) : null
    const config = {
      module: {
        loaders: get(this, 'module.loaders', []).concat([{
          test: /\.scss$/i,
          loaders: extractCss ? extractText.extract(...loaders.slice(1)) : loaders
        }])
      },
      postcss: postcssLoaders
    } as WebpackConfig
    if (extractText && !providedInstance) {
      config.plugins = [
        /**
         * Plugin: ExtractTextPlugin
         * It moves every import "style.css" in entry chunks into a single concatenated css output file. 
         * So your styles are no longer inlined into the javascript, but separate in a css bundle file (styles.css). 
         * If your total stylesheet volume is big, it will be faster because the stylesheet bundle is loaded in parallel to the javascript bundle.
         */
        extractText
      ].concat(get(this, 'plugins', []))
    }
    if (resolveRelativeUrl instanceof Object) {
      config['resolveUrlLoader'] = resolveRelativeUrl
    }
    return config
  }
开发者ID:delebash,项目名称:config-sass,代码行数:64,代码来源:index.ts

示例2: function

  const postcssPluginCreator = function() {
    return [
      autoprefixer(),
      postcssUrl({
        url: (URL: string) => {
          // Only convert root relative URLs, which CSS-Loader won't process into require().
          if (!URL.startsWith('/') || URL.startsWith('//')) {
            return URL;
          }

          if (deployUrl.match(/:\/\//)) {
            // If deployUrl contains a scheme, ignore baseHref use deployUrl as is.
            return `${deployUrl.replace(/\/$/, '')}${URL}`;
          } else if (baseHref.match(/:\/\//)) {
            // If baseHref contains a scheme, include it as is.
            return baseHref.replace(/\/$/, '') +
                `/${deployUrl}/${URL}`.replace(/\/\/+/g, '/');
          } else {
            // Join together base-href, deploy-url and the original URL.
            // Also dedupe multiple slashes into single ones.
            return `/${baseHref}/${deployUrl}/${URL}`.replace(/\/\/+/g, '/');
          }
        }
      })
    ].concat(
        minimizeCss ? [cssnano({ safe: true, autoprefixer: false })] : []
    );
  };
开发者ID:feloy,项目名称:angular-cli,代码行数:28,代码来源:styles.ts

示例3: function

  const postcssPluginCreator = function (loader: webpack.loader.LoaderContext) {
    return [
      postcssImports({
        resolve: (url: string) => url.startsWith('~') ? url.substr(1) : url,
        load: (filename: string) => {
          return new Promise<string>((resolve, reject) => {
            loader.fs.readFile(filename, (err: Error, data: Buffer) => {
              if (err) {
                reject(err);

                return;
              }

              const content = data.toString();
              resolve(content);
            });
          });
        },
      }),
      PostcssCliResources({
        baseHref,
        deployUrl,
        resourcesOutputPath,
        loader,
        filename: `[name]${hashFormat.file}.[ext]`,
      }),
      autoprefixer(),
    ];
  };
开发者ID:DevIntent,项目名称:angular-cli,代码行数:29,代码来源:styles.ts

示例4: _compileSCSS

  /**
   * Compiles SCSS to CSS and passes it through Autoprefixer.
   */
  static _compileSCSS(styles: string): string {
    let compiled = sass.renderSync({
      data: styles,
      outputStyle: 'compressed'
    }).css.toString();


    let prefixer = autoprefixer({
      browsers: ['last 2 versions', 'last 4 Android versions']
    });

    return postcss(prefixer).process(compiled).css;
  }
开发者ID:angular,项目名称:material-tools,代码行数:16,代码来源:CSSBuilder.ts

示例5: function

  const postcssPluginCreator = function() {
    // safe settings based on: https://github.com/ben-eb/cssnano/issues/358#issuecomment-283696193
    const importantCommentRe = /@preserve|@licen[cs]e|[@#]\s*source(?:Mapping)?URL|^!/i;
    const minimizeOptions = {
      autoprefixer: false, // full pass with autoprefixer is run separately
      safe: true,
      mergeLonghand: false, // version 3+ should be safe; cssnano currently uses 2.x
      discardComments : { remove: (comment: string) => !importantCommentRe.test(comment) }
    };

    return [
      postcssUrl([
        {
          // Only convert root relative URLs, which CSS-Loader won't process into require().
          filter: ({ url }: { url: string }) => url.startsWith('/') && !url.startsWith('//'),
          url: ({ url }: { url: string }) => {
            if (deployUrl.match(/:\/\//) || deployUrl.startsWith('/')) {
              // If deployUrl is absolute or root relative, ignore baseHref & use deployUrl as is.
              return `${deployUrl.replace(/\/$/, '')}${url}`;
            } else if (baseHref.match(/:\/\//)) {
              // If baseHref contains a scheme, include it as is.
              return baseHref.replace(/\/$/, '') +
                  `/${deployUrl}/${url}`.replace(/\/\/+/g, '/');
            } else {
              // Join together base-href, deploy-url and the original URL.
              // Also dedupe multiple slashes into single ones.
              return `/${baseHref}/${deployUrl}/${url}`.replace(/\/\/+/g, '/');
            }
          }
        },
        {
          // TODO: inline .cur if not supporting IE (use browserslist to check)
          filter: (asset: any) => !asset.hash && !asset.absolutePath.endsWith('.cur'),
          url: 'inline',
          // NOTE: maxSize is in KB
          maxSize: 10
        }
      ]),
      autoprefixer(),
      customProperties({ preserve: true })
    ].concat(
        minimizeCss ? [cssnano(minimizeOptions)] : []
    );
  };
开发者ID:asnowwolf,项目名称:angular-cli,代码行数:44,代码来源:styles.ts

示例6: function

  const postcssPluginCreator = function() {
    // safe settings based on: https://github.com/ben-eb/cssnano/issues/358#issuecomment-283696193
    const importantCommentRe = /@preserve|@license|[@#]\s*source(?:Mapping)?URL|^!/i;
    const minimizeOptions = {
      autoprefixer: false, // full pass with autoprefixer is run separately
      safe: true,
      mergeLonghand: false, // version 3+ should be safe; cssnano currently uses 2.x
      discardComments : { remove: (comment: string) => !importantCommentRe.test(comment) }
    };

    return [
      postcssUrl({
        url: (URL: string) => {
          // Only convert root relative URLs, which CSS-Loader won't process into require().
          if (!URL.startsWith('/') || URL.startsWith('//')) {
            return URL;
          }

          if (deployUrl.match(/:\/\//)) {
            // If deployUrl contains a scheme, ignore baseHref use deployUrl as is.
            return `${deployUrl.replace(/\/$/, '')}${URL}`;
          } else if (baseHref.match(/:\/\//)) {
            // If baseHref contains a scheme, include it as is.
            return baseHref.replace(/\/$/, '') +
                `/${deployUrl}/${URL}`.replace(/\/\/+/g, '/');
          } else {
            // Join together base-href, deploy-url and the original URL.
            // Also dedupe multiple slashes into single ones.
            return `/${baseHref}/${deployUrl}/${URL}`.replace(/\/\/+/g, '/');
          }
        }
      }),
      autoprefixer(),
      customProperties({ preserve: true})
    ].concat(
        minimizeCss ? [cssnano(minimizeOptions)] : []
    );
  };
开发者ID:3L4CKD4RK,项目名称:angular-cli,代码行数:38,代码来源:styles.ts

示例7: Error

  const postcssPluginCreator = function (loader: webpack.loader.LoaderContext) {
    return [
      postcssImports({
        resolve: (url: string, context: string) => {
          return new Promise<string>((resolve, reject) => {
            let hadTilde = false;
            if (url && url.startsWith('~')) {
              url = url.substr(1);
              hadTilde = true;
            }
            loader.resolve(context, (hadTilde ? '' : './') + url, (err: Error, result: string) => {
              if (err) {
                if (hadTilde) {
                  reject(err);
                  return;
                }
                loader.resolve(context, url, (err: Error, result: string) => {
                  if (err) {
                    reject(err);
                  } else {
                    resolve(result);
                  }
                });
              } else {
                resolve(result);
              }
            });
          });
        },
        load: (filename: string) => {
          return new Promise<string>((resolve, reject) => {
            loader.fs.readFile(filename, (err: Error, data: Buffer) => {
              if (err) {
                reject(err);
                return;
              }

              const content = data.toString();
              resolve(content);
            });
          });
        }
      }),
      postcssUrl({
        filter: ({ url }: PostcssUrlAsset) => url.startsWith('~'),
        url: ({ url }: PostcssUrlAsset) => {
          // Note: This will only find the first node_modules folder.
          const nodeModules = findUp('node_modules', projectRoot);
          if (!nodeModules) {
            throw new Error('Cannot locate node_modules directory.')
          }
          const fullPath = path.join(nodeModules, url.substr(1));
          return path.relative(loader.context, fullPath).replace(/\\/g, '/');
        }
      }),
      postcssUrl([
        {
          // Only convert root relative URLs, which CSS-Loader won't process into require().
          filter: ({ url }: PostcssUrlAsset) => url.startsWith('/') && !url.startsWith('//'),
          url: ({ url }: PostcssUrlAsset) => {
            if (deployUrl.match(/:\/\//) || deployUrl.startsWith('/')) {
              // If deployUrl is absolute or root relative, ignore baseHref & use deployUrl as is.
              return `${deployUrl.replace(/\/$/, '')}${url}`;
            } else if (baseHref.match(/:\/\//)) {
              // If baseHref contains a scheme, include it as is.
              return baseHref.replace(/\/$/, '') +
                `/${deployUrl}/${url}`.replace(/\/\/+/g, '/');
            } else {
              // Join together base-href, deploy-url and the original URL.
              // Also dedupe multiple slashes into single ones.
              return `/${baseHref}/${deployUrl}/${url}`.replace(/\/\/+/g, '/');
            }
          }
        },
        {
          // TODO: inline .cur if not supporting IE (use browserslist to check)
          filter: (asset: PostcssUrlAsset) => {
            return maximumInlineSize > 0 && !asset.hash && !asset.absolutePath.endsWith('.cur');
          },
          url: 'inline',
          // NOTE: maxSize is in KB
          maxSize: maximumInlineSize,
          fallback: 'rebase',
        },
        { url: 'rebase' },
      ]),
      PostcssCliResources({
        deployUrl: loader.loaders[loader.loaderIndex].options.ident == 'extracted' ? '' : deployUrl,
        loader,
        filename: `[name]${hashFormat.file}.[ext]`,
      }),
      autoprefixer({ grid: true }),
    ];
  };
开发者ID:rexebin,项目名称:angular-cli,代码行数:94,代码来源:styles.ts

示例8: getStylesConfig

export function getStylesConfig(wco: WebpackConfigOptions) {
  const { projectRoot, buildOptions, appConfig } = wco;

  const appRoot = path.resolve(projectRoot, appConfig.root);
  const entryPoints: { [key: string]: string[] } = {};
  const globalStylePaths: string[] = [];
  const extraPlugins: any[] = [];
  // style-loader does not support sourcemaps without absolute publicPath, so it's
  // better to disable them when not extracting css
  // https://github.com/webpack-contrib/style-loader#recommended-configuration
  const cssSourceMap = buildOptions.extractCss && buildOptions.sourcemap;

  // Minify/optimize css in production.
  const cssnanoPlugin = cssnano({ safe: true, autoprefixer: false });

  // Convert absolute resource URLs to account for base-href and deploy-url.
  const baseHref = wco.buildOptions.baseHref;
  const deployUrl = wco.buildOptions.deployUrl;
  const postcssUrlOptions = {
    url: (URL: string) => {
      // Only convert absolute URLs, which CSS-Loader won't process into require().
      if (!URL.startsWith('/')) {
        return URL;
      }
      // Join together base-href, deploy-url and the original URL.
      // Also dedupe multiple slashes into single ones.
      return `/${baseHref || ''}/${deployUrl || ''}/${URL}`.replace(/\/\/+/g, '/');
    }
  };
  const urlPlugin = postcssUrl(postcssUrlOptions);
  // We need to save baseHref and deployUrl for the Ejected webpack config to work (we reuse
  //  the function defined above).
  (postcssUrlOptions as any).baseHref = baseHref;
  (postcssUrlOptions as any).deployUrl = deployUrl;
  // Save the original options as arguments for eject.
  urlPlugin[postcssArgs] = postcssUrlOptions;

  // PostCSS plugins.
  const postCssPlugins = [autoprefixer(), urlPlugin].concat(
    buildOptions.target === 'production' ? [cssnanoPlugin] : []
  );

  // determine hashing format
  const hashFormat = getOutputHashFormat(buildOptions.outputHashing);

  // use includePaths from appConfig
  const includePaths: string[] = [];

  if (appConfig.stylePreprocessorOptions
    && appConfig.stylePreprocessorOptions.includePaths
    && appConfig.stylePreprocessorOptions.includePaths.length > 0
  ) {
    appConfig.stylePreprocessorOptions.includePaths.forEach((includePath: string) =>
      includePaths.push(path.resolve(appRoot, includePath)));
  }

  // process global styles
  if (appConfig.styles.length > 0) {
    const globalStyles = extraEntryParser(appConfig.styles, appRoot, 'styles');
    // add style entry points
    globalStyles.forEach(style =>
      entryPoints[style.entry]
        ? entryPoints[style.entry].push(style.path)
        : entryPoints[style.entry] = [style.path]
    );
    // add global css paths
    globalStylePaths.push(...globalStyles.map((style) => style.path));
  }

  // set base rules to derive final rules from
  const baseRules = [
    { test: /\.css$/, loaders: [] },
    { test: /\.scss$|\.sass$/, loaders: ['sass-loader'] },
    { test: /\.less$/, loaders: ['less-loader'] },
    // stylus-loader doesn't support webpack.LoaderOptionsPlugin properly,
    // so we need to add options in its query
    {
      test: /\.styl$/, loaders: [`stylus-loader?${JSON.stringify({
        sourceMap: cssSourceMap,
        paths: includePaths
      })}`]
    }
  ];

  const commonLoaders = [
    // css-loader doesn't support webpack.LoaderOptionsPlugin properly,
    // so we need to add options in its query
    `css-loader?${JSON.stringify({ sourceMap: cssSourceMap, importLoaders: 1 })}`,
    'postcss-loader'
  ];

  // load component css as raw strings
  let rules: any = baseRules.map(({test, loaders}) => ({
    exclude: globalStylePaths, test, loaders: [
      'exports-loader?module.exports.toString()',
      ...commonLoaders,
      ...loaders
    ]
  }));

//.........这里部分代码省略.........
开发者ID:itslenny,项目名称:angular-cli,代码行数:101,代码来源:styles.ts

示例9: DefinePlugin

      {
        test: /\.json$/,
        use: ['json-loader']
      }
    ]
  }
};

export const plugins = [
  new DefinePlugin({
    'process.env': {
      'NODE_ENV': JSON.stringify('development')
    }
  }),

  new LoaderOptionsPlugin({
    debug: false,
    options: {
      postcss: [
        autoprefixer({ browsers: ['last 3 versions', 'Firefox ESR'] })
      ],
      resolve: {}
    }
  })
];

module.exports = webpackMerge(
  config,
  { plugins }
);
开发者ID:jussikinnula,项目名称:angular2-socketio-chat-example,代码行数:30,代码来源:webpack.test.ts

示例10: postcss

 render.then((css: string) => postcss([ autoprefixer({ browsers }) ]).process(css))
开发者ID:davidenke,项目名称:ng-packagr,代码行数:1,代码来源:assets.ts


注:本文中的autoprefixer.default函数示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。