Commit 39b4a661 authored by Evan You's avatar Evan You

refactor: group files into directories

parent 7d74b36f
......@@ -5,10 +5,10 @@ const qs = require('querystring')
const plugin = require('./plugin')
const selectBlock = require('./select')
const loaderUtils = require('loader-utils')
const { attrsToQuery } = require('./utils')
const genStylesCode = require('./styles')
const { genHotReloadCode } = require('./hotReload')
const genCustomBlocksCode = require('./customBlocks')
const { attrsToQuery } = require('./codegen/utils')
const genStylesCode = require('./codegen/styleInjection')
const { genHotReloadCode } = require('./codegen/hotReload')
const genCustomBlocksCode = require('./codegen/customBlocks')
const componentNormalizerPath = require.resolve('./runtime/componentNormalizer')
module.exports = function (source) {
......
const qs = require('querystring')
const loaderUtils = require('loader-utils')
const templateLoaderPath = require.resolve('./templateLoader')
const stylePostLoaderPath = require.resolve('./style-post-loader')
const stylePostLoaderPath = require.resolve('./stylePostLoader')
module.exports = code => code
......
const qs = require('querystring')
const { compileStyle } = require('vue-component-compiler')
// This is a post loader that handles scoped CSS transforms.
// Injected right before css-loader by the global pitcher (../pitch.js)
// for any <style scoped> selection requests initiated from within vue files.
module.exports = function (source, inMap) {
const query = qs.parse(this.resourceQuery.slice(1))
const { code, map, errors } = compileStyle({
source,
filename: this.resourcePath,
id: `data-v-${query.id}`,
map: inMap,
scoped: !!query.scoped,
trim: true
})
if (errors.length) {
this.callback(errors[0])
} else {
this.callback(null, code, map)
}
}
const qs = require('querystring')
const loaderUtils = require('loader-utils')
const compiler = require('vue-template-compiler')
const { genTemplateHotReloadCode } = require('./hotReload')
const { compileTemplate } = require('vue-component-compiler')
const { genTemplateHotReloadCode } = require('../codegen/hotReload')
// Loader that compiles raw template into JavaScript functions.
// This is injected by the global pitcher (../pitch) for template
......@@ -27,19 +27,16 @@ module.exports = function (source) {
comments: query.comments
})
const preprocessOptions = Object.assign({
filename: this.resourcePath
}, options.template)
// for vue-component-compiler
const finalOptions = {
source,
filename: this.resourcePath,
// allow using custom compiler via options
compiler: options.compiler || compiler,
compilerOptions,
// handle possible lang="xxx"
preprocessLang: query.lang,
preprocessOptions,
preprocessOptions: options.template,
// allow customizing behavior of vue-template-es2015-compiler
transpileOptions: options.transpileOptions,
transformAssetUrls: options.transformAssetUrls || true,
......
const hash = require('hash-sum')
const cache = require('lru-cache')(100)
const compiler = require('vue-template-compiler')
const SourceMapGenerator = require('source-map').SourceMapGenerator
const splitRE = /\r?\n/g
const emptyRE = /^(?:\/\/)?\s*$/
module.exports = (content, filename, sourceRoot, needMap) => {
const cacheKey = hash(filename + content)
let output = cache.get(cacheKey)
if (output) return output
output = compiler.parseComponent(content, { pad: 'line' })
if (needMap) {
if (output.script && !output.script.src) {
output.script.map = generateSourceMap(
filename,
content,
output.script.content,
sourceRoot
)
}
if (output.styles) {
output.styles.forEach(style => {
if (!style.src) {
style.map = generateSourceMap(
filename,
content,
style.content,
sourceRoot
)
}
})
}
}
cache.set(cacheKey, output)
return output
}
function generateSourceMap (filename, source, generated, sourceRoot) {
const map = new SourceMapGenerator({ sourceRoot })
map.setSourceContent(filename, source)
generated.split(splitRE).forEach((line, index) => {
if (!emptyRE.test(line)) {
map.addMapping({
source: filename,
original: {
line: index + 1,
column: 0
},
generated: {
line: index + 1,
column: 0
}
})
}
})
return map.toJSON()
}
......@@ -69,7 +69,7 @@ module.exports = class VueLoaderPlugin {
const normalizedRules = rawNormalizedRules.filter(r => r !== normalizedVueRule)
const customFallbackRule = {
loader: require.resolve('./noop'),
loader: require.resolve('./loaders/noop'),
resourceQuery: /type=custom/
}
......@@ -91,7 +91,7 @@ module.exports = class VueLoaderPlugin {
// inject global pitcher (responsible for injecting template compiler
// loader & CSS post loader)
rawRules.unshift({
loader: require.resolve('./pitch')
loader: require.resolve('./loaders/pitch')
})
}
}
......
const qs = require('querystring')
const postcss = require('postcss')
const trim = require('./plugins/trim')
const scoped = require('./plugins/scoped')
// This is a post loader that handles scoped CSS transforms.
// Injected right before css-loader by the global pitcher (../pitch.js)
// for any <style scoped> selection requests initiated from within vue files.
module.exports = function (source, map) {
const cb = this.async()
const query = qs.parse(this.resourceQuery.slice(1))
const id = `data-v-${query.id}`
const plugins = [trim()]
if (query.scoped) {
plugins.push(scoped({ id }))
}
const options = {
to: this.resourcePath,
from: this.resourcePath,
map: false
}
if (map) {
options.map = {
inline: false,
annotation: false,
prev: map
}
}
postcss(plugins)
.process(source, 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(cb)
}
const postcss = require('postcss')
const selectorParser = require('postcss-selector-parser')
module.exports = postcss.plugin('add-id', ({ id }) => root => {
const keyframes = Object.create(null)
root.each(function rewriteSelector (node) {
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 => {
selectors.each(selector => {
let node = null
selector.each(n => {
// ">>>" 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
}
})
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 (/-?animation-name$/.test(decl.prop)) {
decl.value = decl.value.split(',')
.map(v => keyframes[v.trim()] || v.trim())
.join(',')
}
// shorthand
if (/-?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(',')
}
})
}
})
const postcss = require('postcss')
module.exports = postcss.plugin('trim', opts => css => {
css.walk(({ type, raws }) => {
if (type === 'rule' || type === 'atrule') {
raws.before = raws.after = '\n'
}
})
})
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment