Reverting change to only package vue runtime loader

[weaverryan]

Using the runtime build by default makes it harder for beginners and it's hard to know the fix. Specifically, if you follow the "intro docs" to Vue, you will likely try this:

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})

which will not work (and the error will be tough for beginners to spot). As a compromise, on a production build, we print a recommendation so that people can discover the option to use the smaller build.

[Lyrkan]

Displaying the recommendation during prod builds only may be too late I think. If someone starts working on an app only using encore dev/encore dev-server they could use things that won't be compatible with the runtime-only build and then need to do a lot of refactoring in order to be able to use it once they learn about the alias. Also, having a CSP compliant build by default could prevent other issues that are hard to diagnose for beginners.

Couldn't we detect the error thrown by Vue and make it easier to understand instead (with an example of how to add the alias)?

[Lyrkan]

Also, the failing test looks like the one I had to fix recently when working on Webpack 5 : https://github.com/symfony/webpack-encore/pull/645/files#r422717443

[weaverryan]

Couldn't we detect the error thrown by Vue and make it easier to understand instead (with an example of how to add the alias)?

I don't think so? You see the error at runtime. For example, in Vue 3 (this is the source .ts, but you get the general idea of how this looks in the final dist file), you get the error simply because the compile() function is set to one that throws an error: https://github.com/vuejs/vue-next/blob/e954ba21f04f0ef848c687233fcb849d75e4153f/packages/vue/src/runtime.ts#L8

I don't think you can detect that at build time, well, at least not easily.

We could move the "recommendation" to show on any build... I just thought it might be annoying... though being annoying is not the worst thing here. CSP is great, but it's not our main use-case as afaik, it's only a problem in environments like Chrome apps.

[stof]

We could move the "recommendation" to show on any build... I just thought it might be annoying... though being annoying is not the worst thing here. CSP is great, but it's not our main use-case as afaik, it's only a problem in environments like Chrome apps.

Or any site where you deploy CSP.

[weaverryan]

Ok, compromise time! With help from Stof:

1. This PR still defaults to the "full" build. This helps beginners.
2. We now print a recommendation on ALL builds, AND that recommendation includes some info about CSP. So if CSP is not something you've thought about, we've just pinged you about it ;)

To create a smaller (and CSP-compliant) build, see https://symfony.com/doc/current/frontend/encore/vuejs.html#runtime-compiler-build

That points to a docs PR I just made: https://github.com/symfony/symfony-docs/pull/13664/files

3. You can silence the warning (if you really DO want a runtime build and don't like seeing our nice blue message on each build) by explicitly setting runtimeCompilerBuild: true.