Compile error of vue file in webstrom

1. The es6 syntax error in webstorm, the solution:

Open Settings => Languages ​​& Frameworks => Javascript
and change the Javascript Language version to ECMAScript 6

In this way, es6 in all .js files will no longer report errors, but es6 syntax in .vue files will still report errors.

 

2. es6 syntax error in .vue file

(1) Open Settings => File Types find HTML and add *.vue

In this way, the vue file is equivalent to an html file, you can edit css, js, and also have smart tips. However, the es6 syntax still reports an error in the .vue file.

(2). Rough: add type="text/ecmascript-6" directly to the <script> tag, and the code in .vue will be highlighted and support ES6.

(3). Add the  type="es6"  attribute to the script tag

<script type="es6">
</script>

Then open Settings => Language Injections and add XML Tag Injection, as shown below.

 

 3. Added new functions: the .vue file type appears when right-clicking to create a new file, just like a new html file, the method:

Setting-Editor-File and Code Templates Click the plus sign in the upper right corner to add the vue file Name is vue File, Extension is vue, the following position can fill in the custom initialization template content.

Click OK to return. When creating a new project in the project, the vue file webstorm configuration will appear and the new vue file will be completed.

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324770239&siteId=291194637