Rollup-plugin-vue: Version 4 onwards breaks pug templating support?

Created on 7 May 2018 · 2Comments · Source: vuejs/rollup-plugin-vue

Expected behavior

Expect successful build when running rollup

Actual behavior

Build fails with message:

src/index.js → dist/vue-mapbox-map.umd.js...
[!] (vue plugin) TypeError: Cannot read property 'trim' of undefined
src/VueMapboxMap.vue
TypeError: Cannot read property 'trim' of undefined
    at baseCompile (/Users/gareth/dev/github/vue-mapbox-map/node_modules/vue-template-compiler/build.js:4267:28)
    at compile (/Users/gareth/dev/github/vue-mapbox-map/node_modules/vue-template-compiler/build.js:4242:22)
    at actuallyCompile (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@vue/component-compiler-utils/dist/compileTemplate.js:57:55)
    at Object.compileTemplate (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@vue/component-compiler-utils/dist/compileTemplate.js:12:16)
    at SFCCompiler.compileTemplate (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@vue/component-compiler/dist/compiler.js:54:73)
    at SFCCompiler.compileToDescriptor (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@vue/component-compiler/dist/compiler.js:34:54)
    at Object._callee$ (/Users/gareth/dev/github/vue-mapbox-map/node_modules/rollup-plugin-vue/dist/rollup-plugin-vue.common.js:89:39)
    at tryCatch (/Users/gareth/dev/github/vue-mapbox-map/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (/Users/gareth/dev/github/vue-mapbox-map/node_modules/regenerator-runtime/runtime.js:296:22)
    at Generator.prototype.(anonymous function) [as next] (/Users/gareth/dev/github/vue-mapbox-map/node_modules/regenerator-runtime/runtime.js:114:21)
    at step (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@babel/runtime/helpers/asyncToGenerator.js:12:30)
    at _next (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@babel/runtime/helpers/asyncToGenerator.js:27:9)
    at /Users/gareth/dev/github/vue-mapbox-map/node_modules/@babel/runtime/helpers/asyncToGenerator.js:34:7
    at new Promise (/Users/gareth/dev/github/vue-mapbox-map/node_modules/core-js/library/modules/es6.promise.js:177:7)
    at Object.<anonymous> (/Users/gareth/dev/github/vue-mapbox-map/node_modules/@babel/runtime/helpers/asyncToGenerator.js:7:12)
    at Object.transform (/Users/gareth/dev/github/vue-mapbox-map/node_modules/rollup-plugin-vue/dist/rollup-plugin-vue.common.js:115:27)

Steps to reproduce the behavior

This seems to be triggered by using pug, so add / remove to trigger / resolve the issue:

<template lang='pug'>
    div(ref='mapboxMapDiv')
</template>

Source

songololo

👍1

Most helpful comment

I hat the same issue and it took me way too long until I realized the obvious:
You need to have pug as a dependancy installed.

So a simple npm install pug worked for me!

ndsboy on 27 Jul 2018

😄3 👍1

All 2 comments

I hat the same issue and it took me way too long until I realized the obvious:
You need to have pug as a dependancy installed.

So a simple npm install pug worked for me!

ndsboy on 27 Jul 2018

😄3 👍1

The latest version of @vue/component-compiler-utils throws an exception with installation instructions if required preprocessor is not installed, the same error is surfaced here in rollup plugin.