Fixação de referência Uncaught ReferenceError: Vue não é definido com webpack

Estou mudando para um fluxo de trabalho usando o WebPack, que agrupa o código. Durante a transição, eu tropecei neste erro:

Uncaught ReferenceError: Vue não está definido

em eval (Vue" externo?548a:1)

em Object. (pcp_mainbundle.js:172)

em __webpack_require__ (pcp_mainbundle.js:20)

em eval (pcpVue.js?6cb8:1)

em Object. (pcp_mainbundle.js:196)

em __webpack_require__ (pcp_mainbundle.js:20)

em eval (pcpMain.js?814e:1)

em Object. (pcp_mainbundle.js:189)

em __webpack_require__ (pcp_mainbundle.js:20)

em Object. (pcp_mainbundle.js:181)

10000000111a2334:47 Uncaught TypeError: window.pcpRun não é uma função

at 10000000111a2334:47

Assegurei-me que o pacote vue é instalado a partir da npm:

npm instalar vue -save

(estes são dois traços antes de salvar).

Então eu importei-o assim:

importar Vue de 'vue';

como eu estava acostumado com outras importações e, na verdade, como já vi em um muito bom curso Udemy por Maximilian Schwarzmüller.

A razão pela qual não funciona é provavelmente porque este curso Udemy é configurado pelo vue-cli, que configura o package.json.

Eu fiz isto manualmente / escolhi um caminho diferente.

Com efeito, suspeito que 'vue' está a ser redefinido aí, para vue/dist/vue.esm.js

Tenho aqui a dica: Webpack - Introdução ao Vue.js

determinação: { alias: { // Garantir que a Vue build correta é usada 'vue$': 'vue/dist/vue.esm.js' } }

Portanto, eu poderia possivelmente atualizar o meu webpack.config.js.

Eu escolhi simplesmente colocá-lo na minha importação, pois isto Tópico do fórum sugere:

importar Vue de 'vue/dist/vue.esm.js';

Isto agora funciona para mim, o erro Uncaught ReferenceError: Vue não está definido desapareceu.

Atualização 2.3.2020 (solução): externos

Como mencionado, eu estava fazendo a transição do script tag manual inclui para um processo de webpack. Anteriormente, portanto, eu tinha incluído a Vue usando uma tag de script.

Para que isto funcionasse, e porque não estava sendo carregado TWICE, eu tinha aplicado a seguinte solução no webpack.config.js:

externos: {

Vue: 'Vue'.

},

esta leva ao webpack NÃO incluindo o vue -> sempre que ele foi incluído, o webpack assumiu que eu iria fornecê-lo externamente, o que eu não fiz.

A solução é, portanto, remover esta secção externa de webpack.config.js