aboutsummaryrefslogtreecommitdiff
path: root/node_modules/@vue/component-compiler-utils/lib/stylePlugins
diff options
context:
space:
mode:
authorruki <waruqi@gmail.com>2018-11-08 00:38:48 +0800
committerruki <waruqi@gmail.com>2018-11-07 21:53:09 +0800
commit26105034da4fcce7ac883c899d781f016559310d (patch)
treec459a5dc4e3aa0972d9919033ece511ce76dd129 /node_modules/@vue/component-compiler-utils/lib/stylePlugins
parent2c77f00f1a7ecb6c8192f9c16d3b2001b254a107 (diff)
downloadxmake-docs-26105034da4fcce7ac883c899d781f016559310d.tar.gz
xmake-docs-26105034da4fcce7ac883c899d781f016559310d.zip
switch to vuepress
Diffstat (limited to 'node_modules/@vue/component-compiler-utils/lib/stylePlugins')
-rw-r--r--node_modules/@vue/component-compiler-utils/lib/stylePlugins/scoped.ts98
-rw-r--r--node_modules/@vue/component-compiler-utils/lib/stylePlugins/trim.ts10
2 files changed, 108 insertions, 0 deletions
diff --git a/node_modules/@vue/component-compiler-utils/lib/stylePlugins/scoped.ts b/node_modules/@vue/component-compiler-utils/lib/stylePlugins/scoped.ts
new file mode 100644
index 00000000..c0ce6c2a
--- /dev/null
+++ b/node_modules/@vue/component-compiler-utils/lib/stylePlugins/scoped.ts
@@ -0,0 +1,98 @@
+import { Root } from 'postcss'
+import * as postcss from 'postcss'
+// postcss-selector-parser does have typings but it's problematic to work with.
+const selectorParser = require('postcss-selector-parser')
+
+export default postcss.plugin('add-id', (options: any) => (root: Root) => {
+ const id: string = options
+ const keyframes = Object.create(null)
+
+ root.each(function rewriteSelector(node: any) {
+ if (!node.selector) {
+ // handle media queries
+ if (node.type === 'atrule') {
+ if (node.name === 'media' || node.name === 'supports') {
+ node.each(rewriteSelector)
+ } else if (/-?keyframes$/.test(node.name)) {
+ // register keyframes
+ keyframes[node.params] = node.params = node.params + '-' + id
+ }
+ }
+ return
+ }
+ node.selector = selectorParser((selectors: any) => {
+ selectors.each((selector: any) => {
+ let node: any = null
+
+ selector.each((n: any) => {
+ // ">>>" combinator
+ if (n.type === 'combinator' && n.value === '>>>') {
+ n.value = ' '
+ n.spaces.before = n.spaces.after = ''
+ return false
+ }
+ // /deep/ alias for >>>, since >>> doesn't work in SASS
+ if (n.type === 'tag' && n.value === '/deep/') {
+ const prev = n.prev()
+ if (prev && prev.type === 'combinator' && prev.value === ' ') {
+ prev.remove()
+ }
+ n.remove()
+ return false
+ }
+ if (n.type !== 'pseudo' && n.type !== 'combinator') {
+ node = n
+ }
+ })
+
+ if (node) {
+ node.spaces.after = ''
+ } else {
+ // For deep selectors & standalone pseudo selectors,
+ // the attribute selectors are prepended rather than appended.
+ // So all leading spaces must be eliminated to avoid problems.
+ selector.first.spaces.before = ''
+ }
+
+ selector.insertAfter(
+ node,
+ selectorParser.attribute({
+ attribute: id
+ })
+ )
+ })
+ }).processSync(node.selector)
+ })
+
+ // If keyframes are found in this <style>, find and rewrite animation names
+ // in declarations.
+ // Caveat: this only works for keyframes and animation rules in the same
+ // <style> element.
+ if (Object.keys(keyframes).length) {
+ root.walkDecls(decl => {
+ // individual animation-name declaration
+ if (/^(-\w+-)?animation-name$/.test(decl.prop)) {
+ decl.value = decl.value
+ .split(',')
+ .map(v => keyframes[v.trim()] || v.trim())
+ .join(',')
+ }
+ // shorthand
+ if (/^(-\w+-)?animation$/.test(decl.prop)) {
+ decl.value = decl.value
+ .split(',')
+ .map(v => {
+ const vals = v.trim().split(/\s+/)
+ const i = vals.findIndex(val => keyframes[val])
+ if (i !== -1) {
+ vals.splice(i, 1, keyframes[vals[i]])
+ return vals.join(' ')
+ } else {
+ return v
+ }
+ })
+ .join(',')
+ }
+ })
+ }
+})
diff --git a/node_modules/@vue/component-compiler-utils/lib/stylePlugins/trim.ts b/node_modules/@vue/component-compiler-utils/lib/stylePlugins/trim.ts
new file mode 100644
index 00000000..a7e9a0db
--- /dev/null
+++ b/node_modules/@vue/component-compiler-utils/lib/stylePlugins/trim.ts
@@ -0,0 +1,10 @@
+import { Root } from 'postcss'
+import * as postcss from 'postcss'
+
+export default postcss.plugin('trim', () => (css: Root) => {
+ css.walk(({ type, raws }) => {
+ if (type === 'rule' || type === 'atrule') {
+ raws.before = raws.after = '\n'
+ }
+ })
+})