Example of babel integration about template HOT 5 CLOSED

we have added this as part of svelte recipes svelte-society/recipes-mvp#11

from template.

so i see how u guys apply it with the rollup plugin, but i think for new syntax you need to use preprocessors. example:

<script>
  class Cow {
	// stage 3 class properties syntax
	static sound = "moo";
  }
</script>


<main>
  <h1>Cow says {Cow.sound}!</h1>
</main>

now we need to transpile what's in the script, otherwise acorn throws a fit:

[!] (plugin svelte) ParseError: Unexpected token
src/App.svelte
3:   class Cow {
4:     static sound = "moo";
             ^
5:   }
6: </script>
ParseError: Unexpected token
    at error (/Users/swyx/Desktop/Work/testbed/trybabelrecipe/svelte-app/node_modules/svelte/src/compiler/utils/error.ts:25:16)
    at Parser$1.error (/Users/swyx/Desktop/Work/testbed/trybabelrecipe/svelte-app/node_modules/svelte/src/compiler/parse/index.ts:96:3)
    at Parser$1.acorn_error (/Users/swyx/Desktop/Work/testbed/trybabelrecipe/svelte-app/node_modules/svelte/src/compiler/parse/index.ts:89:8)

So the fix is somewhat different. Make sure @babel/core and the rest of your plugins/presets are installed, then:

// rollup.config.js
// ...

export default {
	// ...
  plugins: [
    svelte({
      // ...
      preprocess: {
        script: ({ content }) => {
          return require("@babel/core").transform(content, {
            plugins: ["@babel/plugin-proposal-class-properties"],
          });
        },
      },
    }),
 // ...

note - i'm honestly not sure if this is slow or suboptimal, i literally just cooked up this example and it worked so 🤷

note - you can also use svelte-preprocess

from template.

Hello @bgreater ,
You can find a example here: https://github.com/jimutt/svelte-pick-a-place/blob/master/rollup.config.js

from template.

Another option would be to use Parceljs. It is almost a zero configuration bundler. Look at this article to explain the simple setup.
parcel really has become my bundler of choice.

from template.

@bgreater if it's useful - here's how I do it in Sapper https://github.com/antony/sapper-ie

from template.