{"_id":"08cms","_rev":"1-41519161d6e3ef311fe40849ef29f9a3","name":"08cms","description":"**ats08** 全称08cms automatic tools(08cms 自动化工具)； 设计目的，传统的构建工具对于一个刚接触前端的童鞋过于复杂，还要会写js，还要配置插件什么的 为了让前端写页面更简单方便，自己封装了一套工具，使用者只要用命令行指定目录及简单的几个设置就可以用； 简单说ats08是基于gulp开发的一个cli工具； `特别说明：该工具只适合传统的多页面构建，不适合单页面设计，若是单页面请移步Webpack`","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"08cms","version":"1.0.0","devDependencies":{},"engines":{"node":">=0.10.0"},"scripts":{"start":"npm install -g cnpm --registry=https://registry.npm.taobao.org && cnpm isntall","alias":"alias w='gulp watch' & g='gulp' & m='gulp markdown' & b='gulp build' & ..='cd ..'"},"dependencies":{"async":"^1.5.0","babel-core":"^6.25.0","babel-helper-replace-supers":"^6.24.1","babel-plugin-transform-runtime":"^6.23.0","babel-preset-env":"^1.5.1","babel-preset-es2015":"^6.24.1","babel-preset-stage-2":"^6.24.1","browser-sync":"^2.18.12","cheerio":"^0.19.0","directory-tree":"^2.0.0","fs-extra":"^3.0.1","glob":"^6.0.2","gulp":"^3.9.1","gulp-autoprefixer":"^4.0.0","gulp-babel":"^6.1.2","gulp-changed":"^1.3.0","gulp-concat":"^2.6.0","gulp-connect":"^5.0.0","gulp-convert-encoding":"^0.0.3","gulp-csscomb":"^3.0.6","gulp-csso":"^1.0.1","gulp-data":"^1.2.1","gulp-iconfont":"^5.0.1","gulp-if":"^2.0.0","gulp-imagemin":"^2.4.0","gulp-jimp":"^1.2.7","gulp-jsdoc-to-markdown":"^1.2.2","gulp-jsdoc3":"^0.2.1","gulp-jshint":"^1.12.0","gulp-load-plugins":"^0.10.0","gulp-notify":"^2.2.0","gulp-plumber":"^1.0.1","gulp-rename":"^1.2.2","gulp-restart":"^0.1.1","gulp-sass":"^3.1.0","gulp-sourcemaps":"^2.6.0","gulp-swig":"^0.8.0","gulp-uglify":"^1.4.2","gulp-vue-module":"^0.1.2","gulp-watch":"^4.3.5","gulp-wrap":"^0.11.0","gulp-zip":"^3.0.2","gulp.spritesmith":"^6.0.0","html-to-text":"^2.1.0","iconv-lite":"^0.4.13","images":"^3.0.0","marked":"^0.3.5","merge-stream":"^1.0.0","moment":"^2.10.6","node.extend":"^1.1.5","request":"^2.67.0","through2":"^2.0.1","vinyl-ftp":"^0.4.5","vinyl-sourcemaps-apply":"^0.2.1","wiredep":"^2.2.2","yargs":"^3.29.0"},"gitHead":"75c9266ae07346187b9c0e333a89a0adb07e5bbe","description":"**ats08** 全称08cms automatic tools(08cms 自动化工具)； 设计目的，传统的构建工具对于一个刚接触前端的童鞋过于复杂，还要会写js，还要配置插件什么的 为了让前端写页面更简单方便，自己封装了一套工具，使用者只要用命令行指定目录及简单的几个设置就可以用； 简单说ats08是基于gulp开发的一个cli工具； `特别说明：该工具只适合传统的多页面构建，不适合单页面设计，若是单页面请移步Webpack`","_id":"08cms@1.0.0","_npmVersion":"5.0.3","_nodeVersion":"6.11.0","_npmUser":{"name":"ahuing","email":"88407500@qq.com"},"dist":{"integrity":"sha512-OLGvAXF7HYPaqBsTJKle2BbN6UO+P85CRE+tqCa2x5xmzMwFBu4fXJcIs737EOarPV9FYzW5aUG4nVFoWMGNTg==","shasum":"43beebc2ac0efbb6bc4e0bcb0960d05d62b44312","tarball":"https://registry.npmjs.org/08cms/-/08cms-1.0.0.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHvgSAEuXBWjaZO9YIyzlJipFFqGjVvq/yAUr+KsLo0FAiEA/aS3Rx0/K204sI8keu8iu2AH42+dSDDb8W/OiCtDDJM="}]},"maintainers":[{"name":"ahuing","email":"88407500@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/08cms-1.0.0.tgz_1498641663442_0.45212007663212717"}}},"readme":"# ats08\n#### 简介\n\n**ats08** 全称08cms automatic tools(08cms 自动化工具)；\n设计目的，传统的构建工具对于一个刚接触前端的童鞋过于复杂，还要会写js，还要配置插件什么的\n为了让前端写页面更简单方便，自己封装了一套工具，使用者只要用命令行指定目录及简单的几个设置就可以用；\n简单说ats08是基于gulp开发的一个cli工具；\n`特别说明：该工具只适合传统的多页面构建，不适合单页面设计，若是单页面请移步Webpack`\n\n#### 集成功能\n\n- sass生成css\n- js语法检查、压缩、合并\n- 图片压缩，合并\n- 字体压缩，合成\n- 浏览器自动刷新\n- ftp自动上传\n- html模板,基于swig模板引擎\n- markdown文件生成说明文档\n- 自动抓取js的说明信息生成js说明文档\n- vue 转 js\n\n#### 安装node插件\n\n1. `node` `git` 安装 请自行百度\n1. 在版本库里右键git bash here打开命令行工具(当然用cmd,powershell也可以)\n1. 执行命令`npm install -g cnpm --registry=https://registry.npm.taobao.org` 使用淘宝镜像\n1. 执行命令`cnpm install` 这个过程要很久，20-30分钟，期间会安装一系列插件\n1. 如果没有显示`npm ERR`表示安装完毕，如果显示再执行`cnpm install`\n\n#### 目录结构\n\n```text\n    \n├── .babelrc - \n├── bin - \n    ├── default.js - \n    \n    ├── dev.js - \n    \n    ├── imageresize.js - \n    \n    ├── init.js - \n    \n    ├── jshint.js - \n    \n    ├── markdown.js - \n    \n    ├── pack.js - \n    \n    ├── web.js - \n    \n    └── webdown.js - \n    \n├── editorconfig - \n├── gulpfile.js - \n├── lib - \n    ├── base.json - \n    \n    ├── configs.js - \n    \n    ├── csscomb.json - \n    \n    ├── init.js - \n    \n    ├── js - \n        └── jquery.js - \n        \n    \n    ├── swig - \n        ├── filters.js - \n        \n        └── locals.js - \n        \n    \n    ├── tasks-info.js - \n    \n    └── utils.js - \n    \n├── package.json - \n├── readme.md - \n├── src - \n    └── libs - \n        ├── css - \n            ├── ats.scss - \n            ├── demo.scss - \n            ├── inherit - \n            ├── mixins - \n            ├── static - \n            ├── _font-demo.scss - \n            ├── _font-modal.scss - \n            ├── _grid.scss - \n            ├── _header.scss - \n            ├── _img-demo.scss - \n            ├── _modal.scss - \n            └── _variables.scss - \n        \n        ├── demo.html - \n        \n        ├── fonts - \n            ├── _demo - \n            └── _modal - \n        \n        ├── images - \n            └── _demo - \n        \n        ├── js - \n            ├── demo.js - \n            ├── plugin - \n            ├── static - \n            ├── _common - \n            ├── _js_header.html - \n            └── _seajs - \n        \n        ├── pic - \n            └── s.png - \n        \n        └── _base.html - \n        \n    \n└── tpl - \n    ├── css - \n        ├── fonts.scss - \n        \n        └── images.scss - \n        \n    \n    ├── html - \n        ├── fonts.html - \n        \n        ├── images.html - \n        \n        └── toolsbar.html - \n        \n    \n    ├── markdown - \n        ├── fonts - \n            ├── glyphicons-halflings-regular.eot - \n            ├── glyphicons-halflings-regular.svg - \n            ├── glyphicons-halflings-regular.ttf - \n            ├── glyphicons-halflings-regular.woff - \n            ├── glyphicons-halflings-regular.woff2 - \n            ├── modal.eot - \n            └── modal.woff - \n        \n        ├── img - \n            ├── glyphicons-halflings-white.png - \n            └── glyphicons-halflings.png - \n        \n        ├── index.html - \n        \n        ├── quicksearch.html - \n        \n        ├── scripts - \n            ├── fulltext-search-ui.js - \n            ├── fulltext-search.js - \n            ├── highlight.min.js - \n            ├── jqmodal.js - \n            ├── jquery.zeroclipboard.js - \n            ├── lunr.min.js - \n            ├── prettify - \n            ├── toc.js - \n            └── ZeroClipboard.swf - \n        \n        └── styles - \n            ├── highlight - \n            ├── jqmodal.css - \n            └── site.cerulean.css - \n        \n    \n    └── readme.md - \n    \n\n```\n#### 处理规则\n##### Scss\n\n- 从 `src/css/a.scss` 到 `dist/css/a.css`\n- 完成后自动刷新浏览器\n\n##### JS\n\n- 合并\n合并前\n```text\n    src\n      ├── js\n        ├── _xxx\n          ├── a.js\n          ├── b.js\n```\n合并后 \n```text\n    dist\n      ├── js\n        ├── xxx.js\n```\n- 所有有下划线的文件夹都会将其内部的文件合并成一个文件（以当前文件夹命名）\n- 代码里加`// @require('babel')`标记里，代码可以使用es6写法，工具会自动转换\n\n##### Images\n\n- 合并\n合并前\n```text\n    src\n      ├── images\n        ├── _xxx\n          ├── a.png\n          ├── b.png\n```\n合并后\n```text\n    dist\n      ├── images\n        ├── xxx.png - 合成后的图片\n        ├── xxx.html - 可以直接打开预览调用方式\n    src\n      ├── css\n        ├── _img-xxx.scss - 可直接 `@impot '_img-xxx'`合成后图片的css\n```\n- 合并后 所有有下划线的文件夹都会将其内部的文件合并成一个文件（以当前文件夹命名）\n\n##### Fonts\n\n- 合并\n合并前\n```text\n    src\n      ├── fonts\n        ├── _xxx\n          ├── a.svg\n          ├── b.svg\n```\n合并后\n```text\n    dist\n      ├── fonts\n        ├── xxx.eot - 合成后的字体\n        ├── xxx.woff - 合成后的字体\n        ├── xxx.html - 可以直接打开预览调用方式\n    src\n      ├── css\n        ├── _font-xxx.scss - 可直接 `@impot '_font-xxx'`合成后字体的css\n```\n\n- 合并后 所有有下划线的文件夹都会将其内部的文件合并成一个文件（以当前文件夹命名）\n\n##### Html\n\n- 合并\n合并前\n```text\n    src\n      ├── _base.html\n      ├── index.html\n```\n合并后\n```text\n    dist\n      ├── index.html\n   \n```\n- 支持[swig](https://twig.sensiolabs.org/doc/2.x/)模板引擎  \n- 下划线的不会被处理\n- 模板代码如下\n_base.html\n\n```twig\n<html>\n<head>\n    <title>{% block title %}{% endblock %}</title>\n</head>\n<body>\n    {% block body %}{% endblock %}\n</body>\n</html>\n```\nindex.html\n```twig\n{% extends './_base.html' %}\n{% block title %}标题{% endblock %}\n{% block body %}\n内容\n{% endblock %}\n```\n\n\n##### Vue\n\n- 合并\n处理前\n```text\n    src\n      ├── js\n        ├── aaa.vue\n        ├── _xxx\n          ├── a.vue\n          ├── b.vue\n```\n处理后 \n```text\n    dist\n      ├── js\n        ├── aaa.js\n        ├── xxx.js\n```\n- 基本与JS一样\n- 所有有下划线的文件夹都会将其内部的文件合并成一个文件（以当前文件夹命名）\n\n#### 使用说明\n\n\n例：\ngulp build -p 'C:\\Users\\Administrator\\Desktop\\test'\n显示帮助信息(参数一个字母一个中线，如：-p，大于一个字母两个中线，如：--path)\n\ngulp \t\t查看任务列表\n\t\ngulp init\t查看(设置)当前配置\n\t-p(--path)\t项目地址\n\t\t\t类型：string, 默认值：保留上次的值\n\t\t\t可多个项目地址，用逗号隔开\n\t\t\t前提是多个项目里的每个项目需要预先配配置好\n\n\t-a(--alias)\t可配置别名\n\t\t\t给配置起一个别名，下次直接用别名，如\n\t\t\tgulp watch -p 'C:\\Users\\Administrator\\Desktop\\test\\' \n\t\t\t--src './src' --dist './dist' -a 'demo' \n\t\t\t--distEx 'C:\\Users\\Administrator\\Desktop\\test\\dist1\\'\n\t\t\t下次可直接\n\t\t\tgulp watch -a 'demo'\n\n\t-d(--dev)\t启用开发模式\n\t\t\t类型：bool, 默认值：true\n\n\t--au(--author)\t作者\n\t\t\t类型：string, 默认值：保留上次的值\n\n\t-m(--mode)\t模式\n\t\t\t类型：int, 默认值：保留上次的值\n\t\t\t1 - src/ 直接src为源目录(常用)，下面有js,css,images,fonts\n\t\t\t11 - src/ 直接src为源目录(常用)，下面有js,css,images,fonts\n\t\t\t2 - src/libs libs为源目录，下面有js,css,images,fonts，比1模式多一层\n\t\t\t21 - src/libs libs为源目录，下面有js,css,images,fonts，比1模式多一层\n\t\t\t4 - ats自身核心开发模式\n\t\t\tc - 自定义，有时源代码目录和生成目标目录不是固定，\n\t\t\t可以手动指定\n\n\t--src\t\t源代码目录，当 mode 为\"c\"时有效\n\t\t\t类型：string,  默认值：保留上次的值\n\t\t\tPS：与p的相对路径\n\n\t--dist\t\t源代码目录，当 mode 为\"c\"时有效\n\t\t\t类型：string,  默认值：保留上次的值\n\t\t\tPS：与p的相对路径\n\n\t--scssPaths\t\tscss源目录\n\t\t\t类型：string,  默认值：保留上次的值\n\t\t\tPS：需要绝对路径\n\n\t--distEx\t扩展生成目录，有时我们生成的目录不仅仅只dist目标，\n\t\t\t可能还要将生成的文件复制到另一个目录，\n\t\t\t这样就可以给ats再多指定一个生成目录\n\t\t\t类型：string,  默认值：保留上次的值\n\t\t\tPS：需要绝对路径\n\n\t其它\tJs支持es6写法，具体使用在内容里加 // @require('babel')\n\t\t\t注意要写在注释里，不然会被解析\n\n\t\ngulp build\t初始化或同步一个项目\n\t-p -d -a -m --src --dist --distEx\t同init\n\n\t--all\t重建, 默认不重建，只同步\n\n\t\ngulp watch\t监控一个项目目录\n\t-p -d -a -m --src --dist --distEx\t同init\n\n\t-s(--server)\t创建一个web服务器(写静态页面时需要)\n\t\t\t类型：bool, 默认值：false\n\n\t-o(--open)\t直接在浏览器打开，-s为真时有效\n\t\t\t类型：bool, 默认值：false\n\n\t-f(--ftp)\t处理的文件后直接上传到远程ftp\n\t\t\t类型：bool, 默认值：false\n\n\t\ngulp add\t新加一个分类到项目里\n\t-n(--name)\t分类名称\n\t\t\t类型：string, 默认值：null\n\t\t\t\n\n\t\ngulp clean\t清理文件\t\n\t-p\t同build\t清理后项目目录下src目录,谨慎使用！\n\n\t\ngulp pack:patch\t压缩文件并删除原文件\n\t-p\t项目地址\n\n\t-n\t打包名称\n\n\t\ngulp markdown\tmarkdown文件转html\n\t-p\t从p目录里抓取所有内容，并生成说明文档到当前目录下的docs中\n\n\t--pEx\t可选，默认从p目录里抓取内容，也可以额外指定一个目录一并抓取\n\n\t-t(--type)\t可选，直接从p目录抓取太慢，可以指定类型或者目录，地址抓取\n\t\t\t按类型 --type='js,md,twig,css'\n\t\t\t按目录 --type='e:/a,e:/b'\n\t\t\t按地址 --type='e:/a.md,e:/b.js'\n\n\t\ngulp webdown\t下载网页(扒皮)\t\n\t-h\t网页地址\n\n\t-n\t页面名称\n\n\t-l\t内容图片的标志\n\n\t-d\t下载目录\n\n\t\n","maintainers":[{"name":"ahuing","email":"88407500@qq.com"}],"time":{"modified":"2022-04-04T10:08:24.939Z","created":"2017-06-28T09:21:03.623Z","1.0.0":"2017-06-28T09:21:03.623Z"},"readmeFilename":"readme.md"}