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 平台说明,您可以替换此简介**
|
||||
Gitee 是 OSCHINA 推出的基于 Git 的代码托管平台(同时支持 SVN)。专为开发者提供稳定、高效、安全的云端软件开发协作平台
|
||||
无论是个人、团队、或是企业,都能够用 Gitee 实现代码托管、项目管理、协作开发。企业项目请看 [https://gitee.com/enterprises](https://gitee.com/enterprises)}
|
||||
deadlock-detect 是一款基于OpenKylin社区kylin-code(https://gitee.com/mcy-kylin/kylin-code)的拓展插件,用于C/C++程序的死锁检测及锁状态分析,帮助开发者在Linux系统下识别多线程死锁状态、
|
||||
|
||||
#### 软件架构
|
||||
软件架构说明
|
||||
目前支持架构:
|
||||
|
||||
| 支持架构 | 操作系统 |
|
||||
| ----------- | ----------- |
|
||||
| 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
|
||||
2. 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