Vue Webpack模板缺少解析器

webpack Webpack

逆天飞云

2020-03-11

我只是使用如下所示的webpack模板设置了一个vue项目:http ://vuejs-templates.github.io/webpack/

但是,在运行npm run dev只是为了测试模板是否正常工作后,我收到此错误:

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)

我究竟做错了什么?

第718篇《Vue Webpack模板缺少解析器》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

7个回答
木禾 2020.03.11

我在Docker上使用Nuxt / Vue。我在docker build上遇到了同样的错误。

下面的命令后它不起作用

rm -rf node_modules 
npm install --save-dev prettier@1.12.0
npm run dev

因此,我像这样编辑了Dockerfile并成功了。

FROM node:8.11

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

RUN npm install && npm cache verify
RUN npm install --save-dev prettier@1.12.0
RUN npm run build

EXPOSE 3000

CMD ["npm", "run", "express"]
JinJin小胖 2020.03.11

我得到了与纱线相同的错误,但尝试过npm inpm run dev,而不是和它的工作。

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

Stafan小小 2020.03.11

它已在vue-loader@13.7.2和vue-loader@14.2.3中修复。因此,只需升级即可。

SamEva 2020.03.11

由于vue-cli此处使用了更漂亮的API接口并对其进行了硬编码,因此在project中添加了更漂亮的依赖项@vue/component-compiler-utils

您可以尝试npm i prettier@~1.12.0在此处强制使用更漂亮的版本。

顺便说一句有人提出了修复请求

十三西里GO 2020.03.11

如果您正在使用,laravel-mix那么这对我来说已经解决了:

删除。\ node_modules,删除。\ yarn.lock,然后将以下内容添加到。\ 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"
}

运行纱线,一切都应该正常工作。

JinJin达蒙 2020.03.11

如果您使用的是Yarn,请将其添加到您的文件夹中package.json以强制@vue/component-compiler-utils使用正确的版本:

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

然后重新安装。

参考

Tony老丝 2020.03.11

漂亮的东西1.13.0今天发生更新中引起了这种回归降级到以前的版本以解决此错误:

npm install --save-dev prettier@1.12.0

npm run dev

这应该够了吧。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android