svelte-example-museums
svelte-example-museums copied to clipboard
ie11 still complains about undefined Promise declaration ...
I tried both of the ways you suggested, buble first, but that failed colossal (errors in modern browsers too) for me. So i tried babel with your tweaks.
But it still fails with an undefined Promise in ie11 and there might be even more bugs for ie11 there.
I'd be happy if you can take a look. If needed, i can point you to the complete code, but here's my rollup-config, for starters:
import svelte from 'rollup-plugin-svelte';
import livereload from 'rollup-plugin-livereload';
import { terser } from 'rollup-plugin-terser';
import { scss } from '@kazzkiq/svelte-preprocess-scss';
import babel from '@rollup/plugin-babel';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import { uglify } from "rollup-plugin-uglify";
//
const production = !process.env.ROLLUP_WATCH;
//
const filepath = 'public/ng-cb/ng-cb.js';
// ----------------------- ROLLUP-Options ------------------------->
export default {
input: ['src/Main.js'],
output: {
sourcemap: false,
format: 'iife',
name: 'app',
file: filepath,
},
plugins: [
svelte({
dev: !production,
preprocess: {
style: scss({
outputStyle: 'compressed',
sourceMap: false,
file: 'public/ng-cb/ng-cb.css'
}, { name: 'scss' } ),
},
}),
resolve({
browser: true,
dedupe: importee => importee === 'svelte' || importee.startsWith('svelte/')
}),
!production && livereload('public'),
babel({
babelrc: false,
extensions: [ '.js', '.mjs', '.html', '.svelte' ],
babelHelpers: 'runtime',
exclude: [ 'node_modules/@babel/**', 'node_modules/@babel/core/**' ],
presets: [
[
'@babel/preset-env',
{
targets: '> 0.5%, last 2 versions, not dead',
modules: false,
spec: true,
forceAllTransforms: true,
useBuiltIns: 'usage',
corejs: 3,
debug:true
}
]
],
plugins: [
'@babel/plugin-syntax-dynamic-import',
['@babel/plugin-transform-runtime', {
useESModules: true
}]
]
}),
// commonjs({
// sourceMap: true,
// }),
// uglify({
// }),
production && terser(),
],
watch: {
clearScreen: false
}
};
I started to code this "blob of code", which will widely be used in completely different situations: CMS, SPAs etc. So i wanted a single src-file and Svelte seemed to be perfect for this without much fuzz and without much tooling i thought. Now i want to support ie11 (well i dont want to, but it'd be nice, complaining customer ... ) and whatever i try somethings still fail. The "App" is one base Svelte file which uses some other svelte components and the most "critical" code is in Main.js The problem i'm facing seems to be, that i'm probably (conf~)using babel with mixed js-styles and or incompatible versions of rollup-plugins etc (the exact point i wanted to avoid: the dependency-hell).