CODEWITHSUNDEEP
webpackvue.jsprettier
tobire
tobire

Reputation: 843

vue webpack template missing parser

I was just setting up a vue project using the webpack template like stated here: http://vuejs-templates.github.io/webpack/

However after running npm run dev just to test that the template is working, I get this 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)

What am I doing wrong?

Upvotes: 40

Views: 8642

Answers (7)

pmbanugo
pmbanugo

Reputation: 325

it is fixed in [email protected] and [email protected]. So just upgrade.

Upvotes: 8

Toyinster
Toyinster

Reputation: 29

If you are using laravel-mix then this fixed it for me:

Remove .\node_modules, remove .\yarn.lock then add following to .\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"
}

run yarn and all should be working.

Upvotes: 2

icchi
icchi

Reputation: 26

I use Nuxt/Vue on Docker. I got same error with docker build.

It doesn't work after below commands

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

So I edited Dockerfile like this and it worked.

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"]

Upvotes: 0

Yovar
Yovar

Reputation: 550

If you're using Yarn add this to your package.json to force @vue/component-compiler-utils to use the right version:

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

Then do a fresh install.

reference

Upvotes: 7

JSWhisperer
JSWhisperer

Reputation: 675

I got the same error with yarn, but tried npm i and npm run dev instead and it worked.

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

Upvotes: 0

DannyFeliz
DannyFeliz

Reputation: 802

Since vue-cli uses prettier API interface here and hardcoded the options, and prettier dependency was added in project @vue/component-compiler-utils.

You could try npm i prettier@~1.12.0 to force the prettier version here.

BTW someone did a pull request with the fix

Upvotes: 1

Jesse Hallam
Jesse Hallam

Reputation: 6964

Prettier has caused this regression in their 1.13.0 update which occurred today. Downgrade to the previous version to fix this error:

npm install --save-dev [email protected]

npm run dev

That should do the trick.

Upvotes: 83

Related Questions