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

Commit

Permalink
feat: Provide sourcemap for blocks in .vue file (#215)
Browse files Browse the repository at this point in the history 
* feat: Provide sourcemaps for .vue files

* chore: Bump @vue/component-compiler

* test: Add inline source URL for generated bundle

* chore: Code style fix
  • Loading branch information
@znck
znck committed Jun 24, 2018
1 parent 77a3be7 commit a5928ad
Show file tree
Hide file tree
Showing 4 changed files with 64 additions and 27 deletions.
13 changes: 12 additions & 1 deletion cookbook/typescript-simple/src/MyComponent.vue
View file
Expand Up @@ -6,7 +6,18 @@
// @ts-ignore
import Vue, { VueConstructor } from 'vue'
export default Vue.extend<{ name: string }, {/* methods */}, {/* computed */}, {/* props */}>({
export default Vue.extend<
{ name: string },
{
/* methods */
},
{
/* computed */
},
{
/* props */
}
>({
data() {
return { name: 'Jane Doe' }
}
Expand Down
6 changes: 4 additions & 2 deletions src/index.ts
View file
Expand Up @@ -175,10 +175,12 @@ export default function VuePlugin(opts: VuePluginOptions = {}): Plugin {
if (!request) return

const element = resolveVuePart(descriptors, request)

return 'code' in element
const code = 'code' in element
? ((element as any).code as string) // .code is set when extract styles is used. { css: false }
: element.content
const map = element.map as any

return { code, map }
},

async transform(source: string, filename: string) {
Expand Down
37 changes: 26 additions & 11 deletions test/setup/index.ts
View file
Expand Up @@ -37,26 +37,41 @@ export async function build(filename, css = false): Promise<string> {
external: ['vue']
})

cache[cacheKey] = (await bundle.generate({
const output = await bundle.generate({
format: 'iife',
name: 'App',
sourcemap: true,
globals: {
vue: 'Vue'
}
})).code + (style ? `\n;(function() {
var s = document.createElement('style');
s.type = 'text/css';
document.head.appendChild(s);
s.appendChild(document.createTextNode(${JSON.stringify(style)}))
})()` : '')

return cache[cacheKey]
})

let outputCode = output.code

if (style) {
outputCode += `\n;(function() {
var s = document.createElement('style');
s.type = 'text/css';
document.head.appendChild(s);
s.appendChild(document.createTextNode(${JSON.stringify(style)}))
})()`
}

outputCode += `\n\n//# sourceMappingURL=data:application/json;base64,${new Buffer(JSON.stringify(output.map)).toString('base64')}\n`

cache[cacheKey] = outputCode

return outputCode
}

const VUE_SOURCE = promised(fs).readFile(
path.resolve(__dirname, '../../node_modules/vue/dist/vue.min.js')
)

function encode(any: any) {
return any.toString().replace(/<\//g, '&lt;\/')
}

export async function open(name: string, browser: Browser, code: string, id: string = '#test'): Promise<Page> {
const page = await browser.newPage()

Expand All @@ -69,10 +84,10 @@ export async function open(name: string, browser: Browser, code: string, id: str
<body>
<div id="app"></div>
<script>
${await VUE_SOURCE}
${encode(await VUE_SOURCE)}
</script>
<script>
${await code}
${encode(await code)}
</script>
</body>
</html>`
Expand Down
35 changes: 22 additions & 13 deletions yarn.lock
View file
Expand Up @@ -589,13 +589,14 @@
vue-template-es2015-compiler "^1.6.0"

"@vue/component-compiler@^3.3.2":
version "3.3.3"
resolved "https://registry.yarnpkg.com/@vue/component-compiler/-/component-compiler-3.3.3.tgz#f23b5353515025e81d36448b71422b2510939502"
version "3.4.0"
resolved "https://registry.yarnpkg.com/@vue/component-compiler/-/component-compiler-3.4.0.tgz#3413b02a4ea76354a38db3e0bffd4ecec82b0563"
dependencies:
"@vue/component-compiler-utils" "^1.2.1"
clean-css "^4.1.11"
hash-sum "^1.0.2"
postcss-modules-sync "^1.0.0"
source-map "0.6.*"

"@znck/promised@^1.0.0":
version "1.0.0"
Expand Down Expand Up @@ -1374,14 +1375,14 @@ collection-visit@^1.0.0:
object-visit "^1.0.0"

color-convert@^1.9.0:
version "1.9.1"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.1.tgz#c1261107aeb2f294ebffec9ed9ecad529a6097ed"
version "1.9.2"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.2.tgz#49881b8fba67df12a96bdf3f56c0aab9e7913147"
dependencies:
color-name "^1.1.1"
color-name "1.1.1"

color-name@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
color-name@1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.1.tgz#4b1415304cf50028ea81643643bd82ea05803689"

combined-stream@1.0.6, combined-stream@^1.0.5, combined-stream@~1.0.5:
version "1.0.6"
Expand Down Expand Up @@ -4056,7 +4057,15 @@ postcss@^5.2.5:
source-map "^0.5.6"
supports-color "^3.2.3"

postcss@^6.0.1, postcss@^6.0.10, postcss@^6.0.20, postcss@^6.0.22, postcss@^6.0.9:
postcss@^6.0.1:
version "6.0.23"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
dependencies:
chalk "^2.4.1"
source-map "^0.6.1"
supports-color "^5.4.0"

postcss@^6.0.10, postcss@^6.0.20, postcss@^6.0.22, postcss@^6.0.9:
version "6.0.22"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.22.tgz#e23b78314905c3b90cbd61702121e7a78848f2a3"
dependencies:
Expand Down Expand Up @@ -4818,16 +4827,16 @@ source-map@0.5.x, source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, sourc
version "0.5.7"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"

source-map@0.6.*, source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
version "0.6.1"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"

source-map@^0.4.2, source-map@^0.4.4:
version "0.4.4"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
dependencies:
amdefine ">=0.0.4"

source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
version "0.6.1"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"

spdx-correct@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.0.0.tgz#05a5b4d7153a195bc92c3c425b69f3b2a9524c82"
Expand Down

0 comments on commit a5928ad

Please sign in to comment.