Parcel 2

[mathiasrw]

Is your feature request related to a problem? Please describe.

I would love to use this plugin together with the bundler parcel 2

Describe the solution you'd like

Making a plugin named something parcel-transformer-svelte-preprocess that will make it "almost" a zero-config experience to use svalte and typescript/coffeescript/pug/...

Describe alternatives you've considered

Setting up webpack or rollup just to get typescript in your svelte files is doable, but so many moving parts that it seems cumbersome.

How important is this feature to you?

Super important with an easy setup for more people in the world to be amazed by sveltes capability

[kaisermann]

Hey @mathiasrw 👋

How's Svelte use in parcel these days? Is this issue still relevant?

[mathiasrw]

It sure is ;)

[Indyandie]

Not sure if related but a similar issue came up here. It's closed but the issue still persists. https://github.com/orlov-vo/parcel-transformer-svelte/issues/12

[erincar]

Hi,

I'm also experiencing an issue that I believe is due to the lack of a bridge between parcel-transformer-svelte and svelte-preprocess, so this issue seemed related.

I am trying to use the PostCSS plugin postcss-nested on top of my Parcel 2 & Svelte 3 setup.

The error I'm getting is thrown by parcel-transformer-svelte:

parcel-transformer-svelte: Error in file src/App.svelte: Identifier is expected (28:5)
22:  main {
[...]
28:     & > h1 {
         ^
29:       @apply self-center;
30:     }

However, if I use a nested block outside a svelte file, I am able to get the desired result, i.e. postcss-nested works as expected. Here's my setup:

  "devDependencies": {
    "autoprefixer": "^10.2.5",
    "cssnano": "^4.1.11",
    "parcel": "^2.0.0-beta.2",
    "parcel-plugin-svelte": "^4.0.8",
    "parcel-transformer-svelte": "^1.1.1",
    "postcss": "^8.2.15",
    "postcss-nested": "^5.0.5",
    "svelte": "^3.38.2",
    "svelte-preprocess": "^4.7.3",
    "tailwindcss": "^2.1.2"
  }

.parcelrc:

{
  "extends": ["@parcel/config-default"],
  "transformers": {
    "*.svelte": ["parcel-transformer-svelte"]
  }
}

.postcssrc (In compliance with the TailwindCSS specs):

{
  "plugins": {
    "tailwindcss": {},
    "postcss-nested": {},
    "autoprefixer": {},
    "cssnano": {"preset": "default"},
  }
}

.svelterc:

{
  "preprocess": {
    "postcss": {
      "plugins": ["postcss-nested"],
    }
  }
}

Do you agree that this setup was supposed to let me have nested blocks within *.svelte files? If not, I would love to hear any opinions about whether the problem is svelte-preprocess related.

Thanks.