Laravel-mix: Vue compiler error due to prettier update

[CasparChou]

• Laravel Mix Version: [email protected]
• Node Version: v8.9.4
• NPM Version 5.6.0:
• OS: macOS (latest)

Description:

prettier has been update to 1.13.0 at 2018-05-27T18:16:53.809Z, and it cuz same issue on
vuejs/component-compiler-utils@14

is it possible to fix this issue in this repo. ?

Dependency

[email protected] :
"vue-loader": "^13.7.1",

https://github.com/vuejs/vue-loader/blob/13.x/lib/template-compiler/index.js#L80

Error Message

ERROR in ./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-fa216fae","hasScoped":true,"buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./resources/assets/js/components/modals/AddMember.vue
Module build failed: Error: No parser and no file path given, couldn't infer a parser.
    at normalize (/builds/project/dashboard/node_modules/prettier/index.js:7051:13)
    at formatWithCursor (/builds/project/dashboard/node_modules/prettier/index.js:10370:12)
    at /builds/project/dashboard/node_modules/prettier/index.js:31115:15
    at Object.format (/builds/project/dashboard/node_modules/prettier/index.js:31134:12)
    at Object.module.exports (/builds/project/dashboard/node_modules/vue-loader/lib/template-compiler/index.js:80:23)
 @ ./resources/assets/js/components/modals/AddMember.vue 10:23-270
 @ ./resources/assets/js/app.js
 @ multi ./resources/assets/js/app.js

[saqueib]

npm install prettier@~1.12.1 to fix it

[azz]

As @laodaxyz linked,

This has been fixed in vue-cli, try run:

npm update --depth=9999 @vue/component-compiler-utils

[synthor]

@saqueib Makes no difference.

@azz Doesn't work for me, I get:

development:~/build/m2# npm update --depth=9999 @vue/component-compiler-utils
npm ERR! Maximum call stack size exceeded

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2018-05-28T11_16_22_642Z-debug.log

The log itself:

development:~/build/m2# cat /root/.npm/_logs/2018-05-28T11_16_22_642Z-debug.log
0 info it worked if it ends with ok
1 verbose cli [ '/usr/bin/node',
1 verbose cli '/usr/bin/npm',
1 verbose cli 'update',
1 verbose cli '--depth=9999',
1 verbose cli '@vue/component-compiler-utils' ]
2 info using [email protected]
3 info using [email protected]
4 verbose npm-session edf403766e6c7c52
5 verbose stack RangeError: Maximum call stack size exceeded
5 verbose stack at Array.some ()
5 verbose stack at isNotExtraneous (/usr/lib/node_modules/npm/lib/install/is-extraneous.js:23:47)
5 verbose stack at /usr/lib/node_modules/npm/lib/install/is-extraneous.js:24:14
5 verbose stack at Array.some ()
5 verbose stack at isNotExtraneous (/usr/lib/node_modules/npm/lib/install/is-extraneous.js:23:47)
5 verbose stack at /usr/lib/node_modules/npm/lib/install/is-extraneous.js:24:14
5 verbose stack at Array.some ()
5 verbose stack at isNotExtraneous (/usr/lib/node_modules/npm/lib/install/is-extraneous.js:23:47)
5 verbose stack at /usr/lib/node_modules/npm/lib/install/is-extraneous.js:24:14
5 verbose stack at Array.some ()
5 verbose stack at isNotExtraneous (/usr/lib/node_modules/npm/lib/install/is-extraneous.js:23:47)
5 verbose stack at /usr/lib/node_modules/npm/lib/install/is-extraneous.js:24:14
5 verbose stack at Array.some ()
5 verbose stack at isNotExtraneous (/usr/lib/node_modules/npm/lib/install/is-extraneous.js:23:47)
5 verbose stack at isExtraneous (/usr/lib/node_modules/npm/lib/install/is-extraneous.js:5:17)
5 verbose stack at tree.error.tree.children.filter (/usr/lib/node_modules/npm/lib/outdated.js:205:76)
6 verbose cwd /root/build/m2
7 verbose Linux 4.9.65-1-virthardened
8 verbose argv "/usr/bin/node" "/usr/bin/npm" "update" "--depth=9999" "@vue/component-compiler-utils"
9 verbose node v8.9.3
10 verbose npm v5.5.1
11 error Maximum call stack size exceeded
12 verbose exit [ 1, true ]

[menggong]

@azz it doesn't work, like @CasparChou said, the caller is vue-loader see https://github.com/vuejs/vue-loader/blob/13.x/lib/template-compiler/index.js#L80

[laodaxyz]

vim node_modules/[email protected]@vue-loader/lib/template-compiler/index.js
line 80: // code = prettier.format(code, { semi: false })

[azz]

Sorry, depends on https://github.com/vuejs/vue-loader/pull/1319 being released.

Temp fix is to find node_modules/vue-loader/lib/template-compiler/index.js and add parser: 'babylon' to the options object.

[synthor]

@azz You're our hero, it works!!

Big thanks from Germany to down under Melbourne. :1st_place_medal:

[azz]

Looks like it is fixed in [email protected] and [email protected].

[CasparChou]

Issue resolved, so close

[CasparChou]

vue-loader has been merged patch code, issue which made by prettier 1.13.0 should be solved by using npm install