vueloaderplugin - vue webpack template missing parser

vue-loader

Question

Estaba preparando un proyecto vue usando la plantilla de webpack como se indica aquí: http://vuejs-templates.github.io/webpack/

Sin embargo, después de ejecutar npm run dev solo para probar que la plantilla está funcionando, aparece este error:

Failed to compile with 2 errors                                                                                                                                                                                                                                                           21:49:02
 error  in ./src/App.vue

Module build failed: Error: No parser and no file path given, couldn''t infer a parser.
    at normalize (path/node_modules/prettier/index.js:7051:13)
    at formatWithCursor (path/node_modules/prettier/index.js:10370:12)
    at path/node_modules/prettier/index.js:31115:15
    at Object.format (path/node_modules/prettier/index.js:31134:12)
    at Object.module.exports (path/node_modules/vue-loader/lib/template-compiler/index.js:80:23)

 @ ./src/App.vue 11:0-354
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

 error  in ./src/components/HelloWorld.vue

Module build failed: Error: No parser and no file path given, couldn''t infer a parser.
    at normalize (path/node_modules/prettier/index.js:7051:13)
    at formatWithCursor (path/node_modules/prettier/index.js:10370:12)
    at path/node_modules/prettier/index.js:31115:15
    at Object.format (path/node_modules/prettier/index.js:31134:12)
    at Object.module.exports (path/node_modules/vue-loader/lib/template-compiler/index.js:80:23)

¿Qué estoy haciendo mal?

Answer 1

Si está utilizando laravel-mix entonces esto lo solucionó para mí:

Quite. / Node_modules, quite. / Yarn.lock y luego agregue lo siguiente a. / Package.json

"dependencies": {
    ...
    "prettier": "1.12.1",
    "vue-loader": "13.7.0"
    ...
},
"resolutions": {
    "laravel-mix/vue-loader": "13.7.0",
    "vue-loader/prettier": "1.12.1"
}

correr el hilo y todo debería estar funcionando.

Answer 2

Si usa Yarn, agregue esto a su package.json para forzar @vue/component-compiler-utils a usar la versión correcta:

"resolutions": {
  "@vue/component-compiler-utils/prettier": "1.12.1"
}

Luego haz una nueva instalación.

reference

Answer 3

Ya que vue-cli usa una interfaz API más bonita aquí y codifica las opciones, y se agregó una dependencia más bonita en project @vue/component-compiler-utils .

Puedes probar npm i prettier@~1.12.0 para forzar la versión más bonita aquí.

Por cierto, alguien hizo una solicitud de extracción con la solución

Answer 4

Yo uso Nuxt / Vue en Docker. Obtuve el mismo error con la compilación Docker.

No funciona después de los comandos debajo

rm -rf node_modules 
npm install --save-dev [email protected]
npm run dev

Así que edité Dockerfile así y funcionó.

FROM node:8.11

RUN mkdir -p /app
COPY . /app
WORKDIR /app

RUN npm install && npm cache verify
RUN npm install --save-dev [email protected]
RUN npm run build

EXPOSE 3000

CMD ["npm", "run", "express"]

Answer 5

está fijado en [email protected] y [email protected]. Así que solo actualízate.

Answer 6

Prettier ha causado esta regresión en su actualización 1.13.0 que ocurrió hoy. Degradación a la versión anterior para corregir este error:

npm install --save-dev [email protected]

npm run dev

Eso debería hacer el truco.

Answer 7

npm i el mismo error con hilo, pero probé npm i y npm run dev lugar y funcionó.

yarn v v1.5.1 npm -v 5.6.0 node -v v10.0.0