@8bitstudio/workflow 中文文档教程

发布于 5年前 浏览 26 更新于 3年前

Workflow

npm(作用域)NpmLicense

8bitstudio 使用 gulp 和 webpack 的前端开发工作流程

Installation

确保 Nodejsyarn 已安装和更新。 如果您没有 package.json 文件,请使用 npm init 创建一个。 将包添加到您的 devDependencies (npm install -D @8bitstudio/workflow)。

yarn run workflow init 将在项目的根目录下创建默认的 workflow.config.js 文件。 在那里您可以定义路径等设置。 它还将生成一个默认的 src 文件夹,您可以在其中工作。

Usage

workflow, wf [command] [options]

Commands

  • yarn run workflow – Build files in dist folder.
  • yarn run workflow init – Init examples files and folder to start the project (multi-choices).

Options

您可以向主命令添加标志 yarn run workflow

  • -s, --server – Launch a browsersync server
  • -w, --watch – Watch files and run compile when change
  • -p, --prod, --production – Run production env
  • -h, --help – Show help

Examples

  • workflow – Build files in dist folder
  • workflow --watch --server – Start a server and watch changes
  • workflow --prod – Build files minimified and optimized
  • workflow init – Init example files and folder

 Tasks

  • html: Render pug files. Minimify in production.
  • css: Compile SCSS, autoprefix, sourcemaping. Minimify in production.
  • js: Use webpack and babel. Compile vuejs files. Sourcemaping. Minimify in production
  • static: Just move everything from src to destination folder.
  • images: Compress and optimize in production.
  • svgSprite: Create sprite with all SVGs in destination folder (will also copy the SVGs).
  • translate: Compile .po files into .mo files.

Author

  • Thomas Robert - Web design, front-end development

License

MIT 许可证 – 版权所有 © 2018 年至今,8bitstudio

Workflow

npm (scoped)NpmLicense

Front-end development workflow from 8bitstudio using gulp and webpack

Installation

Make sure Nodejs and yarn are installed and updated. If you don't have a package.json file, create one with npm init. Add the package to your devDependencies (npm install -D @8bitstudio/workflow).

yarn run workflow init will create the default workflow.config.js file at the root of your project. There you can define settings like the paths. It will also generate a default src folder where you can work in.

Usage

workflow, wf [command] [options]

Commands

  • yarn run workflow – Build files in dist folder.
  • yarn run workflow init – Init examples files and folder to start the project (multi-choices).

Options

You can add flags to the main command yarn run workflow

  • -s, --server – Launch a browsersync server
  • -w, --watch – Watch files and run compile when change
  • -p, --prod, --production – Run production env
  • -h, --help – Show help

Examples

  • workflow – Build files in dist folder
  • workflow --watch --server – Start a server and watch changes
  • workflow --prod – Build files minimified and optimized
  • workflow init – Init example files and folder

 Tasks

  • html: Render pug files. Minimify in production.
  • css: Compile SCSS, autoprefix, sourcemaping. Minimify in production.
  • js: Use webpack and babel. Compile vuejs files. Sourcemaping. Minimify in production
  • static: Just move everything from src to destination folder.
  • images: Compress and optimize in production.
  • svgSprite: Create sprite with all SVGs in destination folder (will also copy the SVGs).
  • translate: Compile .po files into .mo files.

Author

  • Thomas Robert - Web design, front-end development

License

MIT License – Copyright © 2018-present, 8bitstudio

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文