文件列表:

vue-demo\.babelrc (402, 2020-09-10)
vue-demo\.editorconfig (147, 2020-09-10)
vue-demo\.eslintignore (51, 2020-09-10)
vue-demo\.eslintrc.js (817, 2020-09-14)
vue-demo\.postcssrc.js (246, 2020-09-10)
vue-demo\build\build.js (1198, 2020-09-10)
vue-demo\build\check-versions.js (1290, 2020-09-10)
vue-demo\build\logo.png (6849, 2020-09-10)
vue-demo\build\utils.js (2587, 2020-09-10)
vue-demo\build\vue-loader.conf.js (553, 2020-09-10)
vue-demo\build\webpack.base.conf.js (2387, 2020-09-14)
vue-demo\build\webpack.dev.conf.js (3004, 2020-09-10)
vue-demo\build\webpack.prod.conf.js (5196, 2020-09-10)
vue-demo\config\dev.env.js (156, 2020-09-10)
vue-demo\config\index.js (2291, 2020-09-10)
vue-demo\config\prod.env.js (61, 2020-09-10)
vue-demo\config\test.env.js (149, 2020-09-10)
vue-demo\index.html (270, 2020-09-10)
vue-demo\node_modules\.bin\acorn (316, 2020-09-10)
vue-demo\node_modules\.bin\acorn.cmd (275, 2020-09-10)
vue-demo\node_modules\.bin\acorn.ps1 (486, 2020-09-10)
vue-demo\node_modules\.bin\ansi-html (332, 2020-09-10)
vue-demo\node_modules\.bin\ansi-html.cmd (283, 2020-09-10)
vue-demo\node_modules\.bin\ansi-html.ps1 (502, 2020-09-10)
vue-demo\node_modules\.bin\atob (318, 2020-09-10)
vue-demo\node_modules\.bin\atob.cmd (276, 2020-09-10)
vue-demo\node_modules\.bin\atob.ps1 (488, 2020-09-10)
vue-demo\node_modules\.bin\autoprefixer-info (354, 2020-09-10)
vue-demo\node_modules\.bin\autoprefixer-info.cmd (294, 2020-09-10)
vue-demo\node_modules\.bin\autoprefixer-info.ps1 (524, 2020-09-10)
vue-demo\node_modules\.bin\babylon (330, 2020-09-10)
vue-demo\node_modules\.bin\babylon.cmd (282, 2020-09-10)
vue-demo\node_modules\.bin\babylon.ps1 (500, 2020-09-10)
vue-demo\node_modules\.bin\browserslist (324, 2020-09-10)
vue-demo\node_modules\.bin\browserslist.cmd (279, 2020-09-10)
vue-demo\node_modules\.bin\browserslist.ps1 (494, 2020-09-10)
vue-demo\node_modules\.bin\chromedriver (344, 2020-09-10)
vue-demo\node_modules\.bin\chromedriver.cmd (289, 2020-09-10)
vue-demo\node_modules\.bin\chromedriver.ps1 (514, 2020-09-10)
... ...

# PostCSS [![Gitter][chat-img]][chat] [chat-img]: https://img.shields.io/badge/Gitter-Join_the_PostCSS_chat-brightgreen.svg [chat]: https://gitter.im/postcss/postcss PostCSS 是一个允许使用 JS 插件转换样式的工具。 这些插件可以检查(lint)你的 CSS,支持 CSS Variables 和 Mixins, 编译尚未被浏览器广泛支持的先进的 CSS 语法,内联图片,以及其它很多优秀的功能。 PostCSS 在工业界被广泛地应用,其中不乏很多有名的行业领导者,如:维基百科,Twitter,阿里巴巴, JetBrains。PostCSS 的 [Autoprefixer] 插件是最流行的 CSS 处理工具之一。 PostCSS 接收一个 CSS 文件并提供了一个 API 来分析、修改它的规则(通过把 CSS 规则转换成一个[抽象语法树]的方式)。在这之后,这个 API 便可被许多[插件]利用来做有用的事情,比如寻错或自动添加 CSS vendor 前缀。 **Twitter 账号:** [@postcss](https://twitter.com/postcss)
**支持 / 讨论:** [Gitter](https://gitter.im/postcss/postcss)
如果需要 PostCSS 商业支持(如咨询,提升公司的前端文化, PostCSS 插件),请联系 [Evil Martians](https://evilmartians.com/?utm_source=postcss) 邮箱 。 [抽象语法树]: https://zh.wikipedia.org/wiki/%E6%8A%BD%E8%B1%A1%E8%AA%9E%E6%B3%95%E6%A8%B9 [Autoprefixer]: https://github.com/postcss/autoprefixer [插件]: https://github.com/postcss/postcss/blob/master/README-cn.md#%E6%8F%92%E4%BB%B6 ## 插件 截止到目前,PostCSS 有 200 多个插件。你可以在 [插件列表] 或 [搜索目录] 找到它们。 下方的列表是我们最喜欢的插件 - 它们很好地演示了我们可以用 PostCSS 做些什么。 如果你有任何新的想法,[开发 PostCSS 插件] 非常简单易上手。 [搜索目录]: http://postcss.parts [插件列表]: https://github.com/postcss/postcss/blob/master/docs/plugins.md ### 解决全局 CSS 的问题 * [`postcss-use`] 允许你在 CSS 里明确地设置 PostCSS 插件,并且只在当前文件执行它们。 * [`postcss-modules`] 和 [`react-css-modules`] 可以自动以组件为单位隔绝 CSS 选择器。 * [`postcss-autoreset`] 是全局样式重置的又一个选择,它更适用于分离的组件。 * [`postcss-initial`] 添加了 `all: initial` 的支持,重置了所有继承的样式。 * [`cq-prolyfill`] 添加了容器查询的支持,允许添加响应于父元素宽度的样式. ### 提前使用先进的 CSS 特性 * [`autoprefixer`] 添加了 vendor 浏览器前缀,它使用 Can I Use 上面的数据。 * [`postcss-preset-env`] 允许你使用未来的 CSS 特性。 ### 更佳的 CSS 可读性 * [`precss`] 囊括了许多插件来支持类似 Sass 的特性,比如 CSS 变量,套嵌,mixins 等。 * [`postcss-sorting`] 给规则的内容以及@规则排序。 * [`postcss-utilities`] 囊括了最常用的简写方式和书写帮助。 * [`short`] 添加并拓展了大量的缩写属性。 ### 图片和字体 * [`postcss-assets`] 可以插入图片尺寸和内联文件。 * [`postcss-sprites`] 能生成雪碧图。 * [`font-magician`] 生成所有在 CSS 里需要的 `@font-face` 规则。 * [`postcss-inline-svg`] 允许你内联 SVG 并定制它的样式。 * [`postcss-write-svg`] 允许你在 CSS 里写简单的 SVG。 ### 提示器(Linters) * [`stylelint`] 是一个模块化的样式提示器。 * [`stylefmt`] 是一个能根据 `stylelint` 规则自动优化 CSS 格式的工具。 * [`doiuse`] 提示 CSS 的浏览器支持性,使用的数据来自于 Can I Use。 * [`colorguard`] 帮助你保持一个始终如一的调色板。 ### 其它 * [`postcss-rtl`] 在单个 CSS 文件里组合了两个方向(左到右,右到左)的样式。 * [`cssnano`] 是一个模块化的 CSS 压缩器。 * [`lost`] 是一个功能强大的 `calc()` 栅格系统。 * [`rtlcss`] 镜像翻转 CSS 样式,适用于 right-to-left 的应用场景。 [`postcss-inline-svg`]: https://github.com/TrySound/postcss-inline-svg [`postcss-preset-env`]: https://github.com/jonathantneal/postcss-preset-env [`react-css-modules`]: https://github.com/gajus/react-css-modules [`postcss-autoreset`]: https://github.com/maximkoretskiy/postcss-autoreset [`postcss-write-svg`]: https://github.com/jonathantneal/postcss-write-svg [`postcss-utilities`]: https://github.com/ismamz/postcss-utilities [`postcss-initial`]: https://github.com/maximkoretskiy/postcss-initial [`postcss-sprites`]: https://github.com/2createStudio/postcss-sprites [`postcss-modules`]: https://github.com/outpunk/postcss-modules [`postcss-sorting`]: https://github.com/hudochenkov/postcss-sorting [`postcss-assets`]: https://github.com/assetsjs/postcss-assets [开发 PostCSS 插件]: https://github.com/postcss/postcss/blob/master/docs/writing-a-plugin.md [`font-magician`]: https://github.com/jonathantneal/postcss-font-magician [`autoprefixer`]: https://github.com/postcss/autoprefixer [`cq-prolyfill`]: https://github.com/ausi/cq-prolyfill [`postcss-rtl`]: https://github.com/vkalinichev/postcss-rtl [`postcss-use`]: https://github.com/postcss/postcss-use [`css-modules`]: https://github.com/css-modules/css-modules [`colorguard`]: https://github.com/SlexAxton/css-colorguard [`stylelint`]: https://github.com/stylelint/stylelint [`stylefmt`]: https://github.com/morishitter/stylefmt [`cssnano`]: http://cssnano.co [`precss`]: https://github.com/jonathantneal/precss [`doiuse`]: https://github.com/anandthakker/doiuse [`rtlcss`]: https://github.com/MohammadYounes/rtlcss [`short`]: https://github.com/jonathantneal/postcss-short [`lost`]: https://github.com/peterramsing/lost ## 语法 PostCSS 可以转化样式到任意语法,不仅仅是 CSS。 如果还没有支持你最喜欢的语法,你可以编写一个解释器以及(或者)一个 stringifier 来拓展 PostCSS。 * [`sugarss`] 是一个以缩进为基础的语法,类似于 Sass 和 Stylus。 * [`postcss-syntax`] 通过文件扩展名自动切换语法。 * [`postcss-html`] 解析类 HTML 文件里`