仅支持无感知验证，
vue-recaptcha-v3
yarn add vue-recaptcha-v3
src/main.js
import { VueReCaptcha } from 'vue-recaptcha-v3';
Vue.use(VueReCaptcha, {
siteKey: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
loaderOptions: {
// 是否使用国内的 recaptcha.net 域名
useRecaptchaNet: true,
// 是否隐藏“由reCAPTCHA 提供保护 隐私 - 使用条件”
autoHideBadge: process.env.N...
分类为 Vue.js 的文章：
配置内容
单引号、末尾分号、关闭了“Rplace ..⏎ with”（有谁知道如何开启并统一格式化工具吗）。
VSCode 配置
"editor.rulers": [80, 120], // 缩进栏线
"editor.tabSize": 2,
"editor.insertSpaces": true,
"editor.formatOnPaste": true,
"editor.formatOnSave": false,
"editor.renderWhitespace": "all", // 显示空格
"emmet.triggerE...
// vue.config.js / webpack.config.js / config/index.js
module.exports = {
devServer: {
proxy: {
// 所有 websocket 接口地址加 /websocket 前缀，例：ws://localhost:8080/websocket/dashboard -> wss://notice.app.upall.cn/dashboard
'/websocket': {
target: 'wss://notice.app.upall.cn',
ws: true,
secure: false,
logLevel: 'debug',
pa...
插件
// ctrl+p
ext install MS-CEINTL.vscode-language-pack-zh-hans
ext install ms-vscode.sublime-keybindings
ext install lixquid.calculator
快捷键
// keybindings.json
// Place your key bindings in this file to override the defaultsauto[]
[
{
"key": "alt+w", // 用标签包裹选中的文字
"command": "editor.emmet.action.wrapWithAbbreviation"...
在项目中调用版本号和git信息
Vue Cli 3
第一步：创建 /vue.config.js，内容如下：
const packageInfo = require('./package.json');
const fs = require('fs');
const gitHEAD = fs.readFileSync('.git/HEAD', 'utf-8').trim(); // ref: refs/heads/feature/xxx
const ref = gitHEAD.split(': ')[1]; // refs/heads/feature/xxx
const branch = gitHEAD.split('/').slice(2).join('/'); // feature/xxx
const commitI...
Vue项目采用整站部署，不使用接口所在站点的二级目录或一级目录
目录结构
/webroot/
├─ api.app.com/
│ ├─ public_html/
│ │ ├─ uploads/
│ │ └─ web.conf
│ ├─ certs/
│ ├─ logs/
│ └─ rebots.txt
└─ wechat.app.com/
├─ public_html/
│ ├─ uploads/ <-- link
│ └─ index.html
├─ certs/
├─ logs/
└─ rebots.txt
webpack dev server...
注：以下代码仅支持向下合并单元格，不支水平合并单元格。
<el-table :data="list" :span-method="cellRowSpanConfig" border>
<el-table-column label="序号" type="index" align="center" fixed>
<template slot-scope="scope">
<span>{{ (pager.page - 1) * pager.size + scope.$index + 1 }}</span>
<...
npm: vue-puzzle-vcode
纯前端校验。
用法
<template>
<Vcode :show="verificationVisible" @success="sendVCode" @close="verificationVisible = false" />
</template>
<script>
import Vcode from 'vue-puzzle-vcode';
export default {
components: {
Vcode,
},
data() {
return {
verificationVisible: false,
...
