Throws SyntaxError: Unterminated template for no apparent reason #307
Description
I'm having an issue with this plugin(?) throwing a SyntaxError: Unterminated template on seemingly valid code produced by a prior plugin. If I remove this plugin, the code runs in Chrome without errors. The Babel REPL (with a configuration as close as I can get it to my real one) also has no trouble transforming the code.
Rollup & Babel configuration
import babel from 'rollup-plugin-babel';
import commonjs from 'rollup-plugin-commonjs';
import filesize from 'rollup-plugin-filesize';
import livereload from 'rollup-plugin-livereload';
import nodeExternal from '@yelo/rollup-node-external';
import resolve from 'rollup-plugin-node-resolve';
import svelte from 'rollup-plugin-svelte';
import { terser } from 'rollup-plugin-terser';
const production = !process.env.ROLLUP_WATCH;
export default {
input: 'src/index.js',
external: nodeExternal({
whitelist: [/@babel/, /svelte/]
}),
output: {
sourcemap: true,
format: 'iife',
name: 'app',
file: 'public/bundle.js'
},
plugins: [
svelte({
legacy: true,
customElement: true,
// enable run-time checks when not in production
dev: !production
}),
// If you have external dependencies installed from
// npm, you'll most likely need these plugins. In
// some cases you'll need additional configuration —
// consult the documentation for details:
// https://github.com/rollup/rollup-plugin-commonjs
resolve(),
commonjs(),
babel({
babelrc: false,
extensions: ['.js', '.html', '.svelte'],
include: ['**/*.js', '**/*.html', '**/*.svelte'],
exclude: ['node_modules/@babel/runtime/**'],
plugins: [
'transform-custom-element-classes',
[
'@babel/plugin-transform-runtime',
{
regenerator: false,
useESModules: false
}
]
],
presets: [
[
'@babel/preset-env',
{
targets: {
ie: '11'
}
}
]
],
runtimeHelpers: true
}),
// Watch the `public` directory and refresh the
// browser on changes when not in production
!production && livereload('public'),
// If we're building for production (npm run build
// instead of npm run dev), minify
production && terser(),
production && filesize()
]
};
rollup-plugin-babel error
rollup v1.10.0 bundles src/index.js → public/bundle.js... [!] (babel plugin) SyntaxError: ~/dls/demos/svelte/src/field.html: Unterminated template (126:31)124 | super();
125 |126 | this.shadowRoot.innerHTML = `<style>:host{display:block}.field{display:inline-flex;flex-flow:column nowrap}._fieldLabelLayout{align-items:center;display:flex;flex-flow:row nowrap}.fieldLabel{}.fieldLabel,.fieldLabel>slot::slotted(label){font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:700;letter-spacing:0;line-height:24px;text-transform:none}.fieldOptional{margin-left:12px}.fieldOptional{color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:14px;font-weight:400;letter-spacing:0px;line-height:20px;text-transform:none}.fieldOptional{display:none}.fieldOptional.optional{display:block}.fieldDetail,.fieldDetail>slot::slotted(p){color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:24px;text-transform:none}.fieldDetail>slot::slotted(p){margin:0;margin-top:4px}.fieldControl,.fieldControl>slot::slotted(input),.fieldControl>slot::slotted(select),.fieldControl>slot::slotted(textarea){color:#3E3939;font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:24px;text-transform:none}.fieldControl>slot::slotted(input)::placeholder,.fieldControl>slot::slotted(textarea)::placeholder{color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:24px;text-transform:none}.fieldControl>slot::slotted(*:only-of-type){margin-top:8px}.fieldControl>slot::slotted(input),.fieldControl>slot::slotted(select),.fieldControl>slot::slotted(textarea){border-color:#E0E3E4;border-radius:2px;border-style:solid;border-width:1px;box-sizing:border-box;display:block;min-height:52px;padding:0 16px;width:100%}.fieldControl>slot::slotted(input[disabled]),.fieldControl>slot::slotted(select[disabled]),.fieldControl>slot::slotted(textarea[disabled]),.fieldControl>slot::slotted(input[readonly]),.fieldControl>slot::slotted(textarea[readonly]){background:#EEEEEE;border-color:#E0E3E4}.fieldControl>slot::slotted(input:focus),.fieldControl>slot::slotted(select:focus),.fieldControl>slot::slotted(textarea:focus){box-shadow:0 2px 6px 0 rgba(0,0,0,0.14);outline:0}.fieldMessage{position:relative}.fieldMessage,.fieldMessage>slot::slotted(p){color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:14px;font-weight:400;letter-spacing:0px;line-height:20px;text-transform:none}.fieldMessage>slot::slotted(p){margin:0;padding-top:8px}.fieldMessage::before{background:red;border-radius:0 0 2px 2px;content:"";height:5px;position:absolute;top:-5px;width:100%}.fieldMessage>slot::slotted(dls-icon-check-small){color:#2D8560}.fieldMessage>slot::slotted(dls-icon-circle-exclamation-small){color:#C73E3E}
| ^
127 |
128 |
129 | init(this, { target: this.shadowRoot }, instance, create_fragment, safe_not_equal, ["theme", "optional"]);
src/field.html (126:31)
SyntaxError: /dls/demos/svelte/src/field.html: Unterminated template (126:31)124 | super();
125 |126 | this.shadowRoot.innerHTML = `<style>:host{display:block}.field{display:inline-flex;flex-flow:column nowrap}._fieldLabelLayout{align-items:center;display:flex;flex-flow:row nowrap}.fieldLabel{}.fieldLabel,.fieldLabel>slot::slotted(label){font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:700;letter-spacing:0;line-height:24px;text-transform:none}.fieldOptional{margin-left:12px}.fieldOptional{color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:14px;font-weight:400;letter-spacing:0px;line-height:20px;text-transform:none}.fieldOptional{display:none}.fieldOptional.optional{display:block}.fieldDetail,.fieldDetail>slot::slotted(p){color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:24px;text-transform:none}.fieldDetail>slot::slotted(p){margin:0;margin-top:4px}.fieldControl,.fieldControl>slot::slotted(input),.fieldControl>slot::slotted(select),.fieldControl>slot::slotted(textarea){color:#3E3939;font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:24px;text-transform:none}.fieldControl>slot::slotted(input)::placeholder,.fieldControl>slot::slotted(textarea)::placeholder{color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:16px;font-weight:400;letter-spacing:0;line-height:24px;text-transform:none}.fieldControl>slot::slotted(*:only-of-type){margin-top:8px}.fieldControl>slot::slotted(input),.fieldControl>slot::slotted(select),.fieldControl>slot::slotted(textarea){border-color:#E0E3E4;border-radius:2px;border-style:solid;border-width:1px;box-sizing:border-box;display:block;min-height:52px;padding:0 16px;width:100%}.fieldControl>slot::slotted(input[disabled]),.fieldControl>slot::slotted(select[disabled]),.fieldControl>slot::slotted(textarea[disabled]),.fieldControl>slot::slotted(input[readonly]),.fieldControl>slot::slotted(textarea[readonly]){background:#EEEEEE;border-color:#E0E3E4}.fieldControl>slot::slotted(input:focus),.fieldControl>slot::slotted(select:focus),.fieldControl>slot::slotted(textarea:focus){box-shadow:0 2px 6px 0 rgba(0,0,0,0.14);outline:0}.fieldMessage{position:relative}.fieldMessage,.fieldMessage>slot::slotted(p){color:#706F6E;font-family:"Lab Grotesque", sans-serif;font-size:14px;font-weight:400;letter-spacing:0px;line-height:20px;text-transform:none}.fieldMessage>slot::slotted(p){margin:0;padding-top:8px}.fieldMessage::before{background:red;border-radius:0 0 2px 2px;content:"";height:5px;position:absolute;top:-5px;width:100%}.fieldMessage>slot::slotted(dls-icon-check-small){color:#2D8560}.fieldMessage>slot::slotted(dls-icon-circle-exclamation-small){color:#C73E3E}
| ^
127 |
128 |
129 | init(this, { target: this.shadowRoot }, instance, create_fragment, safe_not_equal, ["theme", "optional"]);
at Parser.raise (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:3851:17)
at Parser.readTmplToken (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:4817:14)
at TokContext.types$1.template.p [as override] (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:573:52)
at Parser.nextToken (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:4047:18)
at Parser.next (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:3989:10)
at Parser.parseTemplate (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:6610:10)
at Parser.parseExprAtom (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:6291:21)
at Parser.parseExprSubscripts (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:5914:23)
at Parser.parseMaybeUnary (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:5894:21)
at Parser.parseExprOps (/dls/demos/svelte/node_modules/@babel/parser/lib/index.js:5781:23)