index.js
2.23 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
const postcss = require('postcss')
const loaderUtils = require('loader-utils')
const loadPostcssConfig = require('./load-postcss-config')
const trim = require('./plugins/trim')
const scopeId = require('./plugins/scope-id')
module.exports = function (css, map) {
this.cacheable()
const cb = this.async()
const query = loaderUtils.getOptions(this) || {}
let vueOptions = this.options.__vueOptions__
if (!vueOptions) {
if (query.hasInlineConfig) {
this.emitError(
`\n [vue-loader] It seems you are using HappyPack with inline postcss ` +
`options for vue-loader. This is not supported because loaders running ` +
`in different threads cannot share non-serializable options. ` +
`It is recommended to use a postcss config file instead.\n` +
`\n See http://vue-loader.vuejs.org/en/features/postcss.html#using-a-config-file for more details.\n`
)
}
vueOptions = Object.assign({}, this.options.vue, this.vue)
}
loadPostcssConfig(this, vueOptions.postcss)
.then(config => {
const plugins = config.plugins.concat(trim)
const options = Object.assign(
{
to: this.resourcePath,
from: this.resourcePath,
map: false
},
config.options
)
// add plugin for vue-loader scoped css rewrite
if (query.scoped) {
plugins.push(scopeId({ id: query.id }))
}
// source map
if (
this.sourceMap &&
!this.minimize &&
vueOptions.cssSourceMap !== false &&
process.env.NODE_ENV !== 'production' &&
!options.map
) {
options.map = {
inline: false,
annotation: false,
prev: map
}
}
return postcss(plugins)
.process(css, options)
.then(result => {
if (result.messages) {
result.messages.forEach(({ type, file }) => {
if (type === 'dependency') {
this.addDependency(file)
}
})
}
const map = result.map && result.map.toJSON()
cb(null, result.css, map)
return null // silence bluebird warning
})
})
.catch(e => {
console.error(e)
cb(e)
})
}