使用vue-cli运行“无法推断解析器”错误

时间:2018-05-27 19:53:14

标签: node.js webpack vue.js vue-cli prettier

尝试使用vue-cli构建新的webpack项目时,我反复收到错误。我正在关注最新版本(3.0.0-beta.11)上的文档,也尝试使用早期版本,而不是测试版。

当我运行yarn serve时,它会尝试启动开发服务器并构建项目但在此处失败:

error  in ./src/App.vue?vue&type=template&id=7ba5bd90

Module build failed: Error: No parser and no file path given, couldn't infer a parser.
    at normalize (/Users/cory/Code/chickadee/my-project/node_modules/prettier/index.js:7051:13)
    at formatWithCursor (/Users/cory/Code/chickadee/my-project/node_modules/prettier/index.js:10370:12)
    at /Users/cory/Code/chickadee/my-project/node_modules/prettier/index.js:31115:15
    at Object.format (/Users/cory/Code/chickadee/my-project/node_modules/prettier/index.js:31134:12)
    at actuallyCompile (/Users/cory/Code/chickadee/my-project/node_modules/@vue/component-compiler-utils/dist/compileTemplate.js:93:29)
    at compileTemplate (/Users/cory/Code/chickadee/my-project/node_modules/@vue/component-compiler-utils/dist/compileTemplate.js:26:16)
    at Object.module.exports (/Users/cory/Code/chickadee/my-project/node_modules/vue-loader/lib/loaders/templateLoader.js:42:20)

 @ ./src/App.vue?vue&type=template&id=7ba5bd90 1:0-194 1:0-194
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client/index.js (webpack)/hot/dev-server.js ./src/main.js

关于我的设置

  • Mac OS
  • 我正在运行node v8.5.0
  • 软件包随yarn
  • 一起安装

我尝试过的事情

  • vue-cli的不同版本,用于生成新项目。这些项目生成并安装模块。
  • 尝试删除prettier模块,但似乎仍然出现错误。
  • 尝试重新安装所有模块。

我还可以尝试通过此错误吗?

5 个答案:

答案 0 :(得分:7)

从项目中删除当前node_modules文件夹,将"prettier": "^1.12.1"添加到package.json并运行npm install解决了该问题。

另一种选择是运行npm install prettier@1.12.1而不删除

之前的node_modules文件夹

<强>更新

对于某些用户,版本1.12.1无法正常工作

@Kivin提出了另一种解决方案,可在此处找到:vue webpack template missing parser

答案 1 :(得分:6)

已知问题,在下一版vue-cli

中将为fixed
  

在更漂亮的1.13.0中,默认解析器被移除了一个次要版本(曾经是巴比伦)

问题:https://github.com/vuejs/component-compiler-utils/issues/14

更漂亮的回购问题:https://github.com/prettier/prettier/issues/4567

  

对不起,我们犯了这个古老的semver罪 - 我们知道这是一个重大改变,但因为它只影响我们用户的一部分,我们没有碰到主要版本,因为我们不想为我们的用户创建摩擦以进行升级。

     

要获取旧行为,请添加parser: "babylon"您可能还希望锁定package.json 中的特定版本更漂亮。

答案 2 :(得分:4)

正在运行npm install prettier@1.12.1为我解决了这个问题。谢谢lsxliron。

答案 3 :(得分:3)

现在,我尝试了所有的选项..下载和升级更漂亮...但没有人工作。直到我研究了发生的事情。 显然,更漂亮的团队删除了babylon的默认解析器,这样做......打破了互联网。

开玩笑。

Issue repo

最简单的解决方案就是简单地添加解析器。 这已被Vue团队选中,预计将随最新的修订版本一起提供。 如果您正在使用Vue Loader / Yarn,甚至不用费心去尝试所有的建议......我尝试了所有这些。 为我修好的是......去吧  node_modules\vue-loader\lib\template-compiler ...打开index.js并查找

// prettify render fn if (!isProduction) { code = prettier.format(code, { semi: false}) }

并将行更改为:

// prettify render fn
if (!isProduction) {
  code = prettier.format(code, { semi: false, parser: 'babylon' })
}

多数民众赞成! 然后,一旦问题得到解决,一切都将被回滚,你仍然可以。

试试这个...它将为您节省无数分钟的搜索次数....

答案 4 :(得分:1)

正如各种共鸣已经指出的那样,你可能需要回滚更漂亮的软件包的版本。

你的package.json文件中的

,你可能需要强制npm使用一个版本(即删除帽子^)

我看起来像这样

"devDependencies": {

"prettier": "1.12.1",
"typescript": "^2.6.1",
"vue": "^2.5.16",
"vue-styleguidist": "^1.4.4",
"vue-webpack-loaders": "^1.0.6",
"webpack": "^3.1.0"