Skip to content
This repository was archived by the owner on Jan 18, 2022. It is now read-only.

feat: Convert styles to import statements #184

Merged
merged 1 commit into from
May 2, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .eslintrc.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
{
"env": {
"browser": true,
"node": true
"node": true,
"jest": true
},
"globals": {
"Promise": true
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
"homepage": "https://github.com/znck/rollup-plugin-vue#readme",
"dependencies": {
"@babel/runtime": "^7.0.0-beta.39",
"@vue/component-compiler": "^3.1.0",
"@vue/component-compiler": "3.1.1",
"@vue/component-compiler-utils": "^1.2.1",
"debug": "^2.6.0",
"hash-sum": "^1.0.2",
Expand Down
174 changes: 0 additions & 174 deletions src/delegate.js

This file was deleted.

169 changes: 165 additions & 4 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,167 @@
import inline from './simple'
import delegate from './delegate'
import {
createVueFilter,
isVuePartRequest,
createVuePartRequest,
parseVuePartRequest,
resolveVuePart
} from './utils'
import * as path from 'path'
import { parse } from '@vue/component-compiler-utils'
import { createDefaultCompiler, assemble } from '@vue/component-compiler'
import hash from 'hash-sum'
import { relative } from 'path'

inline.delegate = delegate
export default function vue(opts = {}) {
const isVue = createVueFilter(opts.include, opts.exclude)
const isProduction = process.env.NODE_ENV === 'production'
createVuePartRequest.defaultLang = {
...createVuePartRequest.defaultLang,
...opts.defaultLang
}

export default inline
const shouldExtractCss = opts.css === false
const blacklisted = new Set(opts.blacklistCustomBlocks || ['*'])
const whitelisted = new Set(opts.blacklistCustomBlocks || [])

const isAllowed = any =>
(!blacklisted.has('*') || !blacklisted.has(any)) &&
(whitelisted.has('*') || whitelisted.has(any))

delete opts.css
delete opts.blacklistCustomBlocks
delete opts.defaultLang
delete opts.include
delete opts.exclude

const compiler = createDefaultCompiler(opts)
const descriptors = new WeakMap()

return {
name: 'vue.delegate',

resolveId(id) {
if (isVuePartRequest(id)) {
const ref = parseVuePartRequest(id)
const element = resolveVuePart(descriptors, ref)

if (element.src && ref.meta.type !== 'styles')
return path.resolve(path.dirname(ref.filename), element.src)

return id
}
},

load(id) {
if (!isVuePartRequest(id)) return

id = parseVuePartRequest(id)
const element = resolveVuePart(descriptors, id)

return element.code || element.content
},

async transform(source, filename) {
if (isVue(filename)) {
const descriptor = (descriptors[filename] = parse({
filename,
source,
needMap: true
}))
const scopeId =
'data-v-' +
(isProduction
? hash(path.basename(filename) + source)
: hash(filename + source))
const input = {
scopeId,
styles: descriptor.styles.map(style =>
compiler.compileStyle(filename, scopeId, style)
),
customBlocks: []
}

if (descriptor.template) {
input.template = compiler.compileTemplate(
filename,
descriptor.template
)

if (input.template.errors && input.template.errors.length) {
console.error(
'> Errors: ' +
relative(process.cwd(), filename) +
'\n' +
input.template.errors.map(it => ' - ' + it).join('\n')
)
}

if (input.template.tips && input.template.tips.length) {
console.log(
'> Tips: ' +
relative(process.cwd(), filename) +
'\n' +
input.template.tips.map(it => ' - ' + it).join('\n')
)
}
}

input.script = descriptor.script
? {
code: `
export * from '${createVuePartRequest(
filename,
descriptor.script.lang,
'script'
)}'
import script from '${createVuePartRequest(
filename,
descriptor.script.lang,
'script'
)}'
export default script
`
}
: { code: '' }

if (shouldExtractCss) {
input.styles = input.styles
.map((style, index) => {
descriptor.styles[index].code = style.code

input.script.code +=
'\n' +
`import '${createVuePartRequest(
filename,
'css',
'styles',
index
)}'`

if (style.module) {
return { ...style, code: '' }
}
})
.filter(Boolean)
}

const result = assemble(compiler, filename, input, opts)

descriptor.customBlocks.forEach((block, index) => {
if (!isAllowed(block.type)) return
result.code +=
'\n' +
`export * from '${createVuePartRequest(
filename,
block.attrs.lang ||
createVuePartRequest.defaultLang[block.type] ||
block.type,
'customBlocks',
index
)}'`
})

return result
}
}
}
}
Loading