wxa.js

# 语法高亮和检查

# 编辑器配置

提示

推荐使用VSCode开发小程序，提高开发体验和效率💯

# VSCode 配置

使用 wxa 插件实现 .wxa 文件语法高亮~

  1. 在应用商店搜索 wxa 并安装。
  2. MacOS: command + shift + p 或 Windows: ctrl + shift + p，设置 .wxa 文件关联语言模式 wxa即可。

打开项目的.vsode/settings.json，添加以下配置：

{
    "javascript.implicitProjectConfig.experimentalDecorators": true,
    "eslint.enable": true
}
1
2
3
4

提示

wxa 拓展是从 vetur fork 而来，专门对小程序语法和 wxa 文件做了修改。

# WebStorm 配置

  1. 打开WebStorm偏好设置 Windows and Linux: File -> Settings或macOS: WebStorm -> Preferences
  2. 点击 File Types Editor -> File Types，找到 Vue.js Template，在registered Patterns中添加*.wxa

# Eslint代码校验

使用eslint校验代码，在开发阶段就解决弱*问题

{
    "extends": [
        "google"
    ],
    "root": true,
    "env": {
        "commonjs": true,
        "es6": true,
        "node": true
    },
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "parser": "babel-eslint",
        "ecmaFeatures": {
            "experimentalObjectRestSpread": true
        },
        "ecmaVersion": 2017,
        "sourceType": "module"
    },
    "rules": {
        "vue/valid-template-root": "off",
        "no-const-assign": "warn",
        "valid-template-root": "off",
        "no-this-before-super": "warn",
        "no-undef": "warn",
        "no-unreachable": "warn",
        "no-unused-vars": "warn",
        "constructor-super": "warn",
        "valid-typeof": "warn",
        "one-var": "warn",
        "max-len": "off",
        "no-trailing-spaces": "off",
        "require-jsdoc": "warn",
        "camelcase": "warn",
        "no-invalid-this": "warn",
        "new-cap": "warn",
        "guard-for-in": "warn"
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

注意

"parser"指定为"vue-eslint-parser"，能够解析到.wxa文件的结构，否则会出现奇奇怪怪的报错。

← 预加载 →