构建工具(Build Tools)

Context: frontend-dev-bookmarks / Workflow

Toolkits and their ecosystems, that help you automate painful and repeated tasks.


  • Automaton: Task automation tool built in JavaScript.
  • Grunt: Grunt is a task-based command line build tool for JavaScript projects.
  • Gulp: Gulp is a toolkit that helps you automate painful or time-consuming tasks in your development workflow. It's very fast, platform-agnostic and simple.
    • Articles & Tutorials: Publications about gulp or step by step guides for setting up and using gulp in a project.
    • CSS: Gulp plugins for working with CSS files.
    • Concatenation: Plugins for file concatenation. For example bundling CSS or JavaScript files.
      • gulp-concat: This plugin will concat files by your operating systems newLine. It will take the base directory from the first file that passes through it.
      • gulp-group-concat: Concats groups of files into a smaller number of files
    • Deployment: Plugins for pushing built files into production.
      • gulp-tar: Create tarball from files.
      • vinyl-ftp: Blazing fast vinyl adapter for FTP.
      • vinyl-s3: Use S3 as a source or destination of vinyl files.
    • Ecosystem: The network of developers and plugins around gulp.
    • Filters: Plugins for filtering files in a vinyl stream.
      • gulp-cache: A temp file based caching proxy task for gulp.
      • gulp-cached: A simple in-memory file cache for gulp.
      • gulp-changed: Only pass through changed files.
      • gulp-filter: Filter files in a vinyl stream.
      • gulp-newer: Pass through newer source files only.
      • gulp-remember: A plugin for gulp that remembers and recalls files passed through it.
      • vinyl-diff: This library allows you to perform diffs between streams of vinyl.
    • Images: Plugins for working with images.
    • JavaScript: Module loaders, minifiers and other tools for working with JavaScript files.
      • gulp-pure-cjs: Gulp plugin for Pure CommonJS builder.
      • gulp-uglify: Minify files with UglifyJS.
      • yoloader: A CommonJS module loader implementation. It provides tools to bundle a CommonJS based project and to load such bundles.
    • SourceMaps: A source map provides a way of mapping code within a compressed file back to it’s original position in a source file.
    • Utility: Tools and parts for building gulp plugins.
      • gulp-count: Count files in a vinyl stream.
      • gulp-debug: Debug vinyl file streams to see what files are run through your gulp pipeline.
      • gulp-size: Logs out the total size of files in the stream and optionally the individual file-sizes.
      • lazypipe: Lazypipe allows you to create an immutable, lazily-initialized pipeline. It's designed to be used in an environment where you want to reuse partial pipelines, such as with gulp.
      • map-stream: Create a through stream from an asyncronous function.
    • Vinyl: Vinyl is a very simple metadata object that describes a file.
      • gulp-chmod: Change permissions of Vinyl files.
      • gulp-rename: A plugin to rename files easily.
      • mem-fs: Simple in-memory vinyl file store.
      • vinyl-ast: Parse-once and generate-once AST tool bridge for Gulp plugins.
      • vinyl-buffer: Creates a transform stream that takes vinyl files as input, and outputs buffered (isStream() === false) vinyl files as output.
      • vinyl-file: Create a vinyl file from an actual file.
      • vinyl-fs: Vinyl adapter for the file system.
      • vinyl-fs-fake: A vinyl adapter that extends vinyl-fs to allow for easy debugging by passing in virtual files instead of globs, and calling a function instead of writing.
      • vinyl-git: Vinyl adapter for git.
      • vinyl-map: Map vinyl files' contents as strings, so you can easily use existing code without needing yet another gulp plugin!
      • vinyl-paths: Get the file paths in a vinyl stream.
      • vinyl-source-buffer: Convert a text stream into a vinyl pipeline whose content is a buffer.
      • vinyl-source-stream: Use conventional text streams at the start of your gulp or vinyl pipelines, making for nicer interoperability with the existing npm stream.
      • vinyl-to-stream: Convert a vinyl stream to a text stream.
      • vinyl-transform: Wraps standard text transform streams so you can write fewer gulp plugins. Fulfills a similar use case to vinyl-map and vinyl-source-stream.
  • Mimosa: Mimosa is a batteries included web development workflow tool that will get you coding in seconds rather than hunting down plugins and wrangling config for hours.
  • Plop: Micro-generator framework that makes it easy for an entire team to create files with a level or uniformity.
  • Webpack: Webpack is a module bundler. It takes modules with dependencies and generates static assets representing those modules.
  • Yeoman: Yeoman helps you to kickstart new projects, prescribing best practices and tools to help you stay productive. It provides a generator ecosystem.


开源资源分享群:680761714      PHP开源学习群:656323847