deadlock detect init
This commit is contained in:
parent
86a683c4b5
commit
5e8563e4ae
|
@ -0,0 +1,9 @@
|
||||||
|
# Change Log
|
||||||
|
|
||||||
|
All notable changes to the "deadlock-detect" extension will be documented in this file.
|
||||||
|
|
||||||
|
Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
|
||||||
|
|
||||||
|
## [Unreleased]
|
||||||
|
|
||||||
|
- Initial release
|
46
README.md
46
README.md
|
@ -1,39 +1,33 @@
|
||||||
# deadlock-detect
|
# 死锁检测插件
|
||||||
|
|
||||||
#### 介绍
|
#### 介绍
|
||||||
{**以下是 Gitee 平台说明,您可以替换此简介**
|
deadlock-detect 是一款基于OpenKylin社区kylin-code(https://gitee.com/mcy-kylin/kylin-code)的拓展插件,用于C/C++程序的死锁检测及锁状态分析,帮助开发者在Linux系统下识别多线程死锁状态、
|
||||||
Gitee 是 OSCHINA 推出的基于 Git 的代码托管平台(同时支持 SVN)。专为开发者提供稳定、高效、安全的云端软件开发协作平台
|
|
||||||
无论是个人、团队、或是企业,都能够用 Gitee 实现代码托管、项目管理、协作开发。企业项目请看 [https://gitee.com/enterprises](https://gitee.com/enterprises)}
|
|
||||||
|
|
||||||
#### 软件架构
|
#### 软件架构
|
||||||
软件架构说明
|
目前支持架构:
|
||||||
|
|
||||||
|
| 支持架构 | 操作系统 |
|
||||||
|
| ----------- | ----------- |
|
||||||
|
| x86 | OpenKylin 银河麒麟桌面操作系统V10 (SP1) |
|
||||||
|
|
||||||
|
|
||||||
#### 安装教程
|
#### 构建流程
|
||||||
|
|
||||||
|
1. 安装指定版本nodejs:
|
||||||
|
版本要求:>=16.14.x and <17
|
||||||
|
获取地址:https://nodejs.org/dist/
|
||||||
|
|
||||||
|
2. 编译view前端
|
||||||
|
cd
|
||||||
|
npm run build
|
||||||
|
cp
|
||||||
|
3. 编译打包插件
|
||||||
|
yarn
|
||||||
|
vsce package
|
||||||
|
|
||||||
1. xxxx
|
|
||||||
2. xxxx
|
|
||||||
3. xxxx
|
|
||||||
|
|
||||||
#### 使用说明
|
#### 使用说明
|
||||||
|
|
||||||
1. xxxx
|
1. xxxx
|
||||||
2. xxxx
|
2. xxxx
|
||||||
3. xxxx
|
3. xxxx
|
||||||
|
|
||||||
#### 参与贡献
|
|
||||||
|
|
||||||
1. Fork 本仓库
|
|
||||||
2. 新建 Feat_xxx 分支
|
|
||||||
3. 提交代码
|
|
||||||
4. 新建 Pull Request
|
|
||||||
|
|
||||||
|
|
||||||
#### 特技
|
|
||||||
|
|
||||||
1. 使用 Readme\_XXX.md 来支持不同的语言,例如 Readme\_en.md, Readme\_zh.md
|
|
||||||
2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
|
|
||||||
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
|
|
||||||
4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目,是综合评定出的优秀开源项目
|
|
||||||
5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
|
|
||||||
6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
|
|
||||||
|
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -0,0 +1,51 @@
|
||||||
|
{
|
||||||
|
"name": "deadlock-detect",
|
||||||
|
"displayName": "deadlock-detect",
|
||||||
|
"description": "Deadlock detect for C/C++ program which use the posix thread library for Linux system platform.",
|
||||||
|
"version": "0.0.1",
|
||||||
|
"engines": {
|
||||||
|
"vscode": "^1.54.0"
|
||||||
|
},
|
||||||
|
"categories": [
|
||||||
|
"Other"
|
||||||
|
],
|
||||||
|
"activationEvents": [
|
||||||
|
"onCommand:deadlock-detect.open"
|
||||||
|
],
|
||||||
|
"main": "./out/extension.js",
|
||||||
|
"contributes": {
|
||||||
|
"commands": [
|
||||||
|
{
|
||||||
|
"command": "deadlock-detect.open",
|
||||||
|
"title": "C/C++ 死锁检测"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"vscode:prepublish": "yarn run package",
|
||||||
|
"compile": "webpack",
|
||||||
|
"watch": "webpack --watch",
|
||||||
|
"package": "webpack --mode production --devtool hidden-source-map",
|
||||||
|
"compile-tests": "tsc -p . --outDir out",
|
||||||
|
"watch-tests": "tsc -p . -w --outDir out",
|
||||||
|
"pretest": "yarn run compile-tests && yarn run compile && yarn run lint",
|
||||||
|
"lint": "eslint src --ext ts",
|
||||||
|
"test": "node ./out/test/runTest.js"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/vscode": "^1.54.0",
|
||||||
|
"@types/glob": "^7.2.0",
|
||||||
|
"@types/mocha": "^9.1.1",
|
||||||
|
"@types/node": "16.x",
|
||||||
|
"@typescript-eslint/eslint-plugin": "^5.31.0",
|
||||||
|
"@typescript-eslint/parser": "^5.31.0",
|
||||||
|
"eslint": "^8.20.0",
|
||||||
|
"glob": "^8.0.3",
|
||||||
|
"mocha": "^10.0.0",
|
||||||
|
"typescript": "^4.7.4",
|
||||||
|
"ts-loader": "^9.3.1",
|
||||||
|
"webpack": "^5.74.0",
|
||||||
|
"webpack-cli": "^4.10.0",
|
||||||
|
"@vscode/test-electron": "^2.1.5"
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,48 @@
|
||||||
|
// The module 'vscode' contains the VS Code extensibility API
|
||||||
|
// Import the module and reference it with the alias vscode in your code below
|
||||||
|
import * as vscode from 'vscode';
|
||||||
|
import path = require('path');
|
||||||
|
import fs = require("fs");
|
||||||
|
|
||||||
|
function getWebViewContent(context: vscode.ExtensionContext, templatePath: string) {
|
||||||
|
const resourcePath = path.join(context.extensionPath, templatePath);
|
||||||
|
const dirPath = path.dirname(resourcePath);
|
||||||
|
let html = fs.readFileSync(resourcePath, 'utf-8');
|
||||||
|
// vscode不支持直接加载本地资源,需要替换成其专有路径格式,这里只是简单的将样式和JS的路径替换
|
||||||
|
html = html.replace(/(<link.+?href="|<script.+?src="|<img.+?src=")(.+?)"/g, (m, $1, $2) => {
|
||||||
|
return $1 + vscode.Uri.file(path.resolve(dirPath, $2)).with({ scheme: 'vscode-resource' }).toString() + '"';
|
||||||
|
});
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
|
||||||
|
// this method is called when your extension is activated
|
||||||
|
// your extension is activated the very first time the command is executed
|
||||||
|
export function activate(context: vscode.ExtensionContext) {
|
||||||
|
|
||||||
|
// Use the console to output diagnostic information (console.log) and errors (console.error)
|
||||||
|
// This line of code will only be executed once when your extension is activated
|
||||||
|
console.log('Congratulations, your extension "deadlock-detect" is now active!');
|
||||||
|
|
||||||
|
// The command has been defined in the package.json file
|
||||||
|
// Now provide the implementation of the command with registerCommand
|
||||||
|
// The commandId parameter must match the command field in package.json
|
||||||
|
let disposable = vscode.commands.registerCommand('deadlock-detect.open', () => {
|
||||||
|
// The code you place here will be executed every time your command is executed
|
||||||
|
// Display a message box to the user
|
||||||
|
const panel = vscode.window.createWebviewPanel(
|
||||||
|
'deadlockdetectWebview',
|
||||||
|
"C/C++程序死锁检测",
|
||||||
|
vscode.ViewColumn.One,
|
||||||
|
{
|
||||||
|
enableScripts: true,
|
||||||
|
retainContextWhenHidden: false,
|
||||||
|
}
|
||||||
|
);
|
||||||
|
panel.webview.html = getWebViewContent(context, "src/dist/index.html");
|
||||||
|
});
|
||||||
|
|
||||||
|
context.subscriptions.push(disposable);
|
||||||
|
}
|
||||||
|
|
||||||
|
// this method is called when your extension is deactivated
|
||||||
|
export function deactivate() {}
|
|
@ -0,0 +1,23 @@
|
||||||
|
import * as path from 'path';
|
||||||
|
|
||||||
|
import { runTests } from '@vscode/test-electron';
|
||||||
|
|
||||||
|
async function main() {
|
||||||
|
try {
|
||||||
|
// The folder containing the Extension Manifest package.json
|
||||||
|
// Passed to `--extensionDevelopmentPath`
|
||||||
|
const extensionDevelopmentPath = path.resolve(__dirname, '../../');
|
||||||
|
|
||||||
|
// The path to test runner
|
||||||
|
// Passed to --extensionTestsPath
|
||||||
|
const extensionTestsPath = path.resolve(__dirname, './suite/index');
|
||||||
|
|
||||||
|
// Download VS Code, unzip it and run the integration test
|
||||||
|
await runTests({ extensionDevelopmentPath, extensionTestsPath });
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Failed to run tests');
|
||||||
|
process.exit(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
main();
|
|
@ -0,0 +1,15 @@
|
||||||
|
import * as assert from 'assert';
|
||||||
|
|
||||||
|
// You can import and use all API from the 'vscode' module
|
||||||
|
// as well as import your extension to test it
|
||||||
|
import * as vscode from 'vscode';
|
||||||
|
// import * as myExtension from '../../extension';
|
||||||
|
|
||||||
|
suite('Extension Test Suite', () => {
|
||||||
|
vscode.window.showInformationMessage('Start all tests.');
|
||||||
|
|
||||||
|
test('Sample test', () => {
|
||||||
|
assert.strictEqual(-1, [1, 2, 3].indexOf(5));
|
||||||
|
assert.strictEqual(-1, [1, 2, 3].indexOf(0));
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,38 @@
|
||||||
|
import * as path from 'path';
|
||||||
|
import * as Mocha from 'mocha';
|
||||||
|
import * as glob from 'glob';
|
||||||
|
|
||||||
|
export function run(): Promise<void> {
|
||||||
|
// Create the mocha test
|
||||||
|
const mocha = new Mocha({
|
||||||
|
ui: 'tdd',
|
||||||
|
color: true
|
||||||
|
});
|
||||||
|
|
||||||
|
const testsRoot = path.resolve(__dirname, '..');
|
||||||
|
|
||||||
|
return new Promise((c, e) => {
|
||||||
|
glob('**/**.test.js', { cwd: testsRoot }, (err, files) => {
|
||||||
|
if (err) {
|
||||||
|
return e(err);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add files to the test suite
|
||||||
|
files.forEach(f => mocha.addFile(path.resolve(testsRoot, f)));
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Run the mocha test
|
||||||
|
mocha.run(failures => {
|
||||||
|
if (failures > 0) {
|
||||||
|
e(new Error(`${failures} tests failed.`));
|
||||||
|
} else {
|
||||||
|
c();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err);
|
||||||
|
e(err);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
|
@ -0,0 +1,16 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"module": "commonjs",
|
||||||
|
"target": "ES2020",
|
||||||
|
"lib": [
|
||||||
|
"ES2020"
|
||||||
|
],
|
||||||
|
"sourceMap": true,
|
||||||
|
"rootDir": "src",
|
||||||
|
"strict": true /* enable all strict type-checking options */
|
||||||
|
/* Additional Checks */
|
||||||
|
// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
|
||||||
|
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
|
||||||
|
// "noUnusedParameters": true, /* Report errors on unused parameters. */
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,35 @@
|
||||||
|
# dlcheck
|
||||||
|
|
||||||
|
This template should help get you started developing with Vue 2 in Vite.
|
||||||
|
|
||||||
|
## Recommended IDE Setup
|
||||||
|
|
||||||
|
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar) (and disable Vetur).
|
||||||
|
|
||||||
|
## Type Support for `.vue` Imports in TS
|
||||||
|
|
||||||
|
Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases this is fine if you don't really care about component prop types outside of templates.
|
||||||
|
|
||||||
|
However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can run `Volar: Switch TS Plugin on/off` from VSCode command palette.
|
||||||
|
|
||||||
|
## Customize configuration
|
||||||
|
|
||||||
|
See [Vite Configuration Reference](https://vitejs.dev/config/).
|
||||||
|
|
||||||
|
## Project Setup
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### Compile and Hot-Reload for Development
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
### Type-Check, Compile and Minify for Production
|
||||||
|
|
||||||
|
```sh
|
||||||
|
npm run build
|
||||||
|
```
|
|
@ -0,0 +1,2 @@
|
||||||
|
/// <reference types="vite/client" />
|
||||||
|
/// <reference types="unplugin-vue2-script-setup/shims" />
|
|
@ -0,0 +1,13 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" href="/favicon.ico" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>Vite App</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<script type="module" src="/src/main.ts"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
File diff suppressed because it is too large
Load Diff
|
@ -0,0 +1,29 @@
|
||||||
|
{
|
||||||
|
"name": "vue-project",
|
||||||
|
"version": "0.0.0",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vue-tsc --noEmit && vite build",
|
||||||
|
"preview": "vite preview --port 5050",
|
||||||
|
"typecheck": "vue-tsc --noEmit"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@vue/composition-api": "^1.4.6",
|
||||||
|
"echart": "^0.1.3",
|
||||||
|
"echarts": "^5.3.3",
|
||||||
|
"element-ui": "^2.15.9",
|
||||||
|
"vue": "2.6.14"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/node": "^16.11.25",
|
||||||
|
"@vitejs/plugin-legacy": "^1.7.1",
|
||||||
|
"@vue/runtime-dom": "^3.2.31",
|
||||||
|
"typescript": "~4.7.3",
|
||||||
|
"unplugin-vue2-script-setup": "^0.9.3",
|
||||||
|
"vite": "^2.8.4",
|
||||||
|
"vite-plugin-vue2": "^1.9.3",
|
||||||
|
"vue-template-babel-compiler": "^1.2.0",
|
||||||
|
"vue-template-compiler": "2.6.14",
|
||||||
|
"vue-tsc": "^0.37.3"
|
||||||
|
}
|
||||||
|
}
|
Binary file not shown.
After Width: | Height: | Size: 4.2 KiB |
|
@ -0,0 +1,237 @@
|
||||||
|
<template>
|
||||||
|
<div id="app">
|
||||||
|
<template>
|
||||||
|
<el-tabs v-model="activeName" @tab-click="handleClick" style="width: 80%;margin: auto;">
|
||||||
|
<el-tab-pane label="本地检测" name="first">
|
||||||
|
<div style="width: 60%;margin:auto">
|
||||||
|
<br />
|
||||||
|
<el-radio v-model="radio" label="1">检测指定进程</el-radio>
|
||||||
|
<el-radio v-model="radio" label="2">检测可执行程序</el-radio>
|
||||||
|
<div id="pid" v-if="radio == '1'">
|
||||||
|
<br />
|
||||||
|
<el-input v-model="local_pid_input" placeholder="请输入被检测进程PID"></el-input>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="comm" v-if="radio == '2'">
|
||||||
|
<br />
|
||||||
|
<el-input v-model="local_cmd_input" placeholder="请输入被检测程序命令行"></el-input>
|
||||||
|
<br /><br />
|
||||||
|
<el-input v-model="local_env_input" placeholder="请输入被检测程序环境变量"></el-input>
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
|
<el-input placeholder="请输入管理员密码" v-model="local_passwd_input" show-password></el-input>
|
||||||
|
<br /> <br />
|
||||||
|
<el-button type="primary" v-on:click="begin_local_check(1,radio)">开始检测</el-button>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
|
||||||
|
<el-tab-pane label="远程检测" name="second">
|
||||||
|
<div style="width: 60%;margin:auto">
|
||||||
|
<br />
|
||||||
|
<el-input v-model="remote_pid_input" placeholder="请输入被检测进程PID"></el-input>
|
||||||
|
<br />
|
||||||
|
<el-input v-model="remote_addr_input" placeholder="请输入远程IP地址"></el-input>
|
||||||
|
<el-input v-model="remote_account_input" placeholder="请输入远程用户账号"></el-input>
|
||||||
|
<el-input placeholder="请输入远程用户密码" v-model="remote_passwd_input" show-password></el-input>
|
||||||
|
<br /> <br />
|
||||||
|
<el-button type="primary" @click="begin_remote_check()">开始检测</el-button>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
|
||||||
|
<el-card v-loading="loading" element-loading-text="正在检测..." class="box-card" style="width: 80%;margin: auto;">
|
||||||
|
<div slot="header" class="clearfix" v-if="loading == false">
|
||||||
|
<span>检测结果</span>
|
||||||
|
</div>
|
||||||
|
<div v-if="loading== false" v-for="o in 4" :key="o" class="text item">
|
||||||
|
{{'线程信息: ' + o }}
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<el-card id="main" style="width: 80%; height: 400px; margin: auto;">
|
||||||
|
</el-card >
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.text {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
.clearfix:before,
|
||||||
|
.clearfix:after {
|
||||||
|
display: table;
|
||||||
|
content: "";
|
||||||
|
}
|
||||||
|
.clearfix:after {
|
||||||
|
clear: both
|
||||||
|
}
|
||||||
|
|
||||||
|
.box-card {
|
||||||
|
width: 480px;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import * as echarts from 'echarts';
|
||||||
|
|
||||||
|
const cmd_type = {
|
||||||
|
NONE: 0,
|
||||||
|
LOCAL_PID: 1,
|
||||||
|
LOCAL_CMDLINE: 2,
|
||||||
|
REMOTE_PID: 3,
|
||||||
|
REMOTE_CMDLINE: 4,
|
||||||
|
};
|
||||||
|
|
||||||
|
function TableData () {
|
||||||
|
this.CmdType = cmd_type.NONE;
|
||||||
|
this.Pid = 0;
|
||||||
|
this.Passwd = "";
|
||||||
|
this.Addr = "";
|
||||||
|
this.User = "";
|
||||||
|
this.CmdLine = "";
|
||||||
|
this.Env = {};
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
local_pid_input: -1,
|
||||||
|
local_passwd_input: '',
|
||||||
|
local_cmd_input: '',
|
||||||
|
local_env_input: '',
|
||||||
|
remote_account_input: '',
|
||||||
|
remote_passwd_input: '',
|
||||||
|
remote_addr_input: '',
|
||||||
|
remote_pid_input: -1,
|
||||||
|
radio: '1',
|
||||||
|
loading: true,
|
||||||
|
afterchecked: false,
|
||||||
|
deadlockgraph: {},
|
||||||
|
deadlockinfo: [],
|
||||||
|
lockinfo:[]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.chartDraw();
|
||||||
|
this.listener();
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
begin_local_check(isLocal, isPid){
|
||||||
|
let td = new TableData();
|
||||||
|
if(isLocal){
|
||||||
|
|
||||||
|
}else if(!isLocal){
|
||||||
|
td.CmdType = cmd_type.REMOTE_PID;
|
||||||
|
td.Pid = remote_pid_input;
|
||||||
|
td.Addr = remote_addr_input;
|
||||||
|
td.User = remote_
|
||||||
|
}
|
||||||
|
this.$vscode.postMessage(data);
|
||||||
|
},
|
||||||
|
chartDraw() {
|
||||||
|
var myChart = echarts.init(document.getElementById('main'));
|
||||||
|
var option;
|
||||||
|
option = {
|
||||||
|
title: {
|
||||||
|
text: '死锁关系图'
|
||||||
|
},
|
||||||
|
tooltip: {},
|
||||||
|
animationDurationUpdate: 1500,
|
||||||
|
animationEasingUpdate: 'quinticInOut',
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
type: 'graph',
|
||||||
|
layout: 'none',
|
||||||
|
symbolSize: 50,
|
||||||
|
roam: false,
|
||||||
|
label: {
|
||||||
|
show: true
|
||||||
|
},
|
||||||
|
edgeSymbol: ['circle', 'arrow'],
|
||||||
|
edgeSymbolSize: [4, 10],
|
||||||
|
edgeLabel: {
|
||||||
|
fontSize: 20
|
||||||
|
},
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
name: 'Node 1',
|
||||||
|
x: 300,
|
||||||
|
y: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Node 2',
|
||||||
|
x: 800,
|
||||||
|
y: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Node 3',
|
||||||
|
x: 550,
|
||||||
|
y: 100
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Node 4',
|
||||||
|
x: 550,
|
||||||
|
y: 500
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// links: [],
|
||||||
|
links: [
|
||||||
|
{
|
||||||
|
source: 0,
|
||||||
|
target: 1,
|
||||||
|
symbolSize: [5, 20],
|
||||||
|
label: {
|
||||||
|
show: true
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
width: 5,
|
||||||
|
curveness: 0.2
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
source: 'Node 2',
|
||||||
|
target: 'Node 1',
|
||||||
|
label: {
|
||||||
|
show: true
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
curveness: 0.2
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
source: 'Node 1',
|
||||||
|
target: 'Node 3'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
source: 'Node 2',
|
||||||
|
target: 'Node 3'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
source: 'Node 2',
|
||||||
|
target: 'Node 4'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
source: 'Node 1',
|
||||||
|
target: 'Node 4'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
lineStyle: {
|
||||||
|
opacity: 0.9,
|
||||||
|
width: 2,
|
||||||
|
curveness: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
option && myChart.setOption(option);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
</script>
|
|
@ -0,0 +1,74 @@
|
||||||
|
/* color palette from <https://github.com/vuejs/theme> */
|
||||||
|
:root {
|
||||||
|
--vt-c-white: #ffffff;
|
||||||
|
--vt-c-white-soft: #f8f8f8;
|
||||||
|
--vt-c-white-mute: #f2f2f2;
|
||||||
|
|
||||||
|
--vt-c-black: #181818;
|
||||||
|
--vt-c-black-soft: #222222;
|
||||||
|
--vt-c-black-mute: #282828;
|
||||||
|
|
||||||
|
--vt-c-indigo: #2c3e50;
|
||||||
|
|
||||||
|
--vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
|
||||||
|
--vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
|
||||||
|
--vt-c-divider-dadarkrk-1: rgba(84, 84, 84, 0.65);
|
||||||
|
--vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
|
||||||
|
|
||||||
|
--vt-c-text-light-1: var(--vt-c-indigo);
|
||||||
|
--vt-c-text-light-2: rgba(60, 60, 60, 0.66);
|
||||||
|
--vt-c-text-dark-1: var(--vt-c-white);
|
||||||
|
--vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* semantic color variables for this project */
|
||||||
|
:root {
|
||||||
|
--color-background: var(--vt-c-white);
|
||||||
|
--color-background-soft: var(--vt-c-white-soft);
|
||||||
|
--color-background-mute: var(--vt-c-white-mute);
|
||||||
|
|
||||||
|
--color-border: var(--vt-c-divider-light-2);
|
||||||
|
--color-border-hover: var(--vt-c-divider-light-1);
|
||||||
|
|
||||||
|
--color-heading: var(--vt-c-text-light-1);
|
||||||
|
--color-text: var(--vt-c-text-light-1);
|
||||||
|
|
||||||
|
--section-gap: 160px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
:root {
|
||||||
|
--color-background: var(--vt-c-black);
|
||||||
|
--color-background-soft: var(--vt-c-black-soft);
|
||||||
|
--color-background-mute: var(--vt-c-black-mute);
|
||||||
|
|
||||||
|
--color-border: var(--vt-c-divider-dark-2);
|
||||||
|
--color-border-hover: var(--vt-c-divider-dark-1);
|
||||||
|
|
||||||
|
--color-heading: var(--vt-c-text-dark-1);
|
||||||
|
--color-text: var(--vt-c-text-dark-2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
*,
|
||||||
|
*::before,
|
||||||
|
*::after {
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
position: relative;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
min-height: 100vh;
|
||||||
|
color: var(--color-text);
|
||||||
|
background: var(--color-background);
|
||||||
|
transition: color 0.5s, background-color 0.5s;
|
||||||
|
line-height: 1.6;
|
||||||
|
font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
|
||||||
|
Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
|
||||||
|
font-size: 15px;
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69" xmlns:v="https://vecta.io/nano"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
|
After Width: | Height: | Size: 308 B |
|
@ -0,0 +1,13 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import ElementUI from 'element-ui';
|
||||||
|
import 'element-ui/lib/theme-chalk/index.css';
|
||||||
|
|
||||||
|
import App from './App.vue';
|
||||||
|
|
||||||
|
|
||||||
|
Vue.use(ElementUI);
|
||||||
|
|
||||||
|
new Vue({
|
||||||
|
el: '#app',
|
||||||
|
render: h => h(App)
|
||||||
|
});
|
|
@ -0,0 +1,25 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"baseUrl": "./",
|
||||||
|
"target": "esnext",
|
||||||
|
"useDefineForClassFields": true,
|
||||||
|
"module": "esnext",
|
||||||
|
"moduleResolution": "node",
|
||||||
|
"isolatedModules": true,
|
||||||
|
"strict": true,
|
||||||
|
"jsx": "preserve",
|
||||||
|
"sourceMap": true,
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"allowJs": true,
|
||||||
|
"paths": {
|
||||||
|
"@/*": ["src/*"]
|
||||||
|
},
|
||||||
|
"lib": ["esnext", "dom", "dom.iterable", "scripthost"],
|
||||||
|
"skipLibCheck": true
|
||||||
|
},
|
||||||
|
"vueCompilerOptions": {
|
||||||
|
"target": 2
|
||||||
|
},
|
||||||
|
"include": ["vite.config.*", "env.d.ts", "src/**/*", "src/**/*.vue"]
|
||||||
|
}
|
|
@ -0,0 +1,30 @@
|
||||||
|
import { fileURLToPath } from 'url'
|
||||||
|
|
||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import legacy from '@vitejs/plugin-legacy'
|
||||||
|
import { createVuePlugin as vue2 } from 'vite-plugin-vue2'
|
||||||
|
// @ts-ignore
|
||||||
|
import vueTemplateBabelCompiler from 'vue-template-babel-compiler'
|
||||||
|
import scriptSetup from 'unplugin-vue2-script-setup/vite'
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [
|
||||||
|
vue2({
|
||||||
|
jsx: true,
|
||||||
|
vueTemplateOptions: {
|
||||||
|
compiler: vueTemplateBabelCompiler
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
scriptSetup(),
|
||||||
|
legacy({
|
||||||
|
targets: ['ie >= 11'],
|
||||||
|
additionalLegacyPolyfills: ['regenerator-runtime/runtime']
|
||||||
|
})
|
||||||
|
],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
|
@ -0,0 +1,47 @@
|
||||||
|
# Welcome to your VS Code Extension
|
||||||
|
|
||||||
|
## What's in the folder
|
||||||
|
|
||||||
|
* This folder contains all of the files necessary for your extension.
|
||||||
|
* `package.json` - this is the manifest file in which you declare your extension and command.
|
||||||
|
* The sample plugin registers a command and defines its title and command name. With this information VS Code can show the command in the command palette. It doesn’t yet need to load the plugin.
|
||||||
|
* `src/extension.ts` - this is the main file where you will provide the implementation of your command.
|
||||||
|
* The file exports one function, `activate`, which is called the very first time your extension is activated (in this case by executing the command). Inside the `activate` function we call `registerCommand`.
|
||||||
|
* We pass the function containing the implementation of the command as the second parameter to `registerCommand`.
|
||||||
|
|
||||||
|
## Setup
|
||||||
|
|
||||||
|
* install the recommended extensions (amodio.tsl-problem-matcher and dbaeumer.vscode-eslint)
|
||||||
|
|
||||||
|
|
||||||
|
## Get up and running straight away
|
||||||
|
|
||||||
|
* Press `F5` to open a new window with your extension loaded.
|
||||||
|
* Run your command from the command palette by pressing (`Ctrl+Shift+P` or `Cmd+Shift+P` on Mac) and typing `Hello World`.
|
||||||
|
* Set breakpoints in your code inside `src/extension.ts` to debug your extension.
|
||||||
|
* Find output from your extension in the debug console.
|
||||||
|
|
||||||
|
## Make changes
|
||||||
|
|
||||||
|
* You can relaunch the extension from the debug toolbar after changing code in `src/extension.ts`.
|
||||||
|
* You can also reload (`Ctrl+R` or `Cmd+R` on Mac) the VS Code window with your extension to load your changes.
|
||||||
|
|
||||||
|
|
||||||
|
## Explore the API
|
||||||
|
|
||||||
|
* You can open the full set of our API when you open the file `node_modules/@types/vscode/index.d.ts`.
|
||||||
|
|
||||||
|
## Run tests
|
||||||
|
|
||||||
|
* Open the debug viewlet (`Ctrl+Shift+D` or `Cmd+Shift+D` on Mac) and from the launch configuration dropdown pick `Extension Tests`.
|
||||||
|
* Press `F5` to run the tests in a new window with your extension loaded.
|
||||||
|
* See the output of the test result in the debug console.
|
||||||
|
* Make changes to `src/test/suite/extension.test.ts` or create new test files inside the `test/suite` folder.
|
||||||
|
* The provided test runner will only consider files matching the name pattern `**.test.ts`.
|
||||||
|
* You can create folders inside the `test` folder to structure your tests any way you want.
|
||||||
|
|
||||||
|
## Go further
|
||||||
|
|
||||||
|
* Reduce the extension size and improve the startup time by [bundling your extension](https://code.visualstudio.com/api/working-with-extensions/bundling-extension).
|
||||||
|
* [Publish your extension](https://code.visualstudio.com/api/working-with-extensions/publishing-extension) on the VS Code extension marketplace.
|
||||||
|
* Automate builds by setting up [Continuous Integration](https://code.visualstudio.com/api/working-with-extensions/continuous-integration).
|
|
@ -0,0 +1,48 @@
|
||||||
|
//@ts-check
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const path = require('path');
|
||||||
|
|
||||||
|
//@ts-check
|
||||||
|
/** @typedef {import('webpack').Configuration} WebpackConfig **/
|
||||||
|
|
||||||
|
/** @type WebpackConfig */
|
||||||
|
const extensionConfig = {
|
||||||
|
target: 'node', // VS Code extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
|
||||||
|
mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')
|
||||||
|
|
||||||
|
entry: './src/extension.ts', // the entry point of this extension, 📖 -> https://webpack.js.org/configuration/entry-context/
|
||||||
|
output: {
|
||||||
|
// the bundle is stored in the 'out' folder (check package.json), 📖 -> https://webpack.js.org/configuration/output/
|
||||||
|
path: path.resolve(__dirname, 'out'),
|
||||||
|
filename: 'extension.js',
|
||||||
|
libraryTarget: 'commonjs2'
|
||||||
|
},
|
||||||
|
externals: {
|
||||||
|
vscode: 'commonjs vscode' // the vscode-module is created on-the-fly and must be excluded. Add other modules that cannot be webpack'ed, 📖 -> https://webpack.js.org/configuration/externals/
|
||||||
|
// modules added here also need to be added in the .vscodeignore file
|
||||||
|
},
|
||||||
|
resolve: {
|
||||||
|
// support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
|
||||||
|
extensions: ['.ts', '.js']
|
||||||
|
},
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /\.ts$/,
|
||||||
|
exclude: /node_modules/,
|
||||||
|
use: [
|
||||||
|
{
|
||||||
|
loader: 'ts-loader'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
devtool: 'nosources-source-map',
|
||||||
|
infrastructureLogging: {
|
||||||
|
level: "log", // enables logging required for problem matchers
|
||||||
|
},
|
||||||
|
};
|
||||||
|
module.exports = [ extensionConfig ];
|
Loading…
Reference in New Issue