From bc5ac730a50fb42e94d0652746c6542c590bf5a3 Mon Sep 17 00:00:00 2001 From: redhoodsu Date: Thu, 15 Aug 2024 11:18:08 +0800 Subject: [PATCH] feat: theme --- .eslintrc.json | 1 + .github/FUNDING.yml | 2 ++ .github/workflows/main.yml | 31 +++++++++++++++++++++++++++++++ .github/workflows/publish.yml | 31 +++++++++++++++++++++++++++++++ .gitignore | 2 +- LICENSE | 21 +++++++++++++++++++++ README.md | 14 ++++++++++++-- package.json | 11 +++++++++-- src/back.js | 11 +++++++++-- src/index.js | 13 ++++++++++++- vue-devtools | 2 +- 11 files changed, 130 insertions(+), 9 deletions(-) create mode 100644 .github/FUNDING.yml create mode 100644 .github/workflows/main.yml create mode 100644 .github/workflows/publish.yml create mode 100644 LICENSE diff --git a/.eslintrc.json b/.eslintrc.json index b3bad6b..3f546d7 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -6,6 +6,7 @@ "commonjs": true }, "parserOptions": { + "ecmaVersion": "latest", "sourceType": "module" }, "extends": "eslint:recommended", diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml new file mode 100644 index 0000000..df64aa5 --- /dev/null +++ b/.github/FUNDING.yml @@ -0,0 +1,2 @@ +ko_fi: surunzi +open_collective: eruda \ No newline at end of file diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml new file mode 100644 index 0000000..6494afd --- /dev/null +++ b/.github/workflows/main.yml @@ -0,0 +1,31 @@ +name: CI + +on: + workflow_dispatch: + push: + branches: + - 'master' + paths: + - 'src/**/*' + +jobs: + ci: + + runs-on: ubuntu-latest + + strategy: + matrix: + node-version: [16.x] + + steps: + - uses: actions/checkout@v2 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v2 + with: + node-version: ${{ matrix.node-version }} + - run: | + npm install -g @liriliri/lsla + npm install -g yarn + npm run init + npm run init:front + npm run ci diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml new file mode 100644 index 0000000..1aec90d --- /dev/null +++ b/.github/workflows/publish.yml @@ -0,0 +1,31 @@ +name: Publish to NPM + +on: + workflow_dispatch: + release: + types: [created] + +jobs: + publish: + + runs-on: ubuntu-latest + + steps: + - name: Checkout + uses: actions/checkout@v2 + - name: Setup Node + uses: actions/setup-node@v2 + with: + node-version: '18.x' + registry-url: 'https://registry.npmjs.org' + - name: Build eruda-features + run: | + npm install -g @liriliri/lsla + npm install -g yarn + npm run init + npm run init:front + npm run build + - name: Publish package on NPM + run: npm publish + env: + NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} \ No newline at end of file diff --git a/.gitignore b/.gitignore index 06d3802..66453c7 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,5 @@ node_modules/ -src/devtools.js +src/devtools.txt eruda-vue.js eruda-vue.js.map package-lock.json \ No newline at end of file diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..6cb7856 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2024-present liriliri + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index 5f0d9b6..1124ad5 100644 --- a/README.md +++ b/README.md @@ -1,11 +1,21 @@ # eruda-vue -Eruda plugin for vue. +[![NPM version][npm-image]][npm-url] +[![Build status][ci-image]][ci-url] +[![License][license-image]][npm-url] + +[npm-image]: https://img.shields.io/npm/v/eruda-vue.svg +[npm-url]: https://npmjs.org/package/eruda-vue +[ci-image]: https://img.shields.io/github/actions/workflow/status/liriliri/eruda-vue/main.yml?branch=master&style=flat-square +[ci-url]: https://github.com/liriliri/eruda-vue/actions/workflows/main.yml +[license-image]: https://img.shields.io/npm/l/eruda-vue.svg + +Eruda plugin for Vue. ## Demo Browse it on your phone: -[https://eruda.liriliri.io/](https://eruda.liriliri.io/) +[https://eruda.liriliri.io/?plugin=vue](https://eruda.liriliri.io/?plugin=vue) ## Install diff --git a/package.json b/package.json index d2c7365..0e96b44 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,7 @@ "name": "eruda-vue", "version": "1.0.0", "main": "eruda-vue.js", + "description": "Eruda plugin for Vue", "files": [ "eruda-vue.js", "eruda-vue.js.map" @@ -10,7 +11,7 @@ "init": "git submodule init && git submodule update && npm install --force && cd vue-devtools && yarn && npm run build", "init:front": "npm run build:front && npm run copy:front", "build:front": "cd vue-devtools/packages/shell-eruda && npm run build", - "copy:front": "lsla shx cp -r vue-devtools/packages/shell-eruda/build/devtools.js src/devtools.js", + "copy:front": "lsla shx cp -r vue-devtools/packages/shell-eruda/build/devtools.js src/devtools.txt", "dev": "webpack-dev-server --host 0.0.0.0 --mode development", "build": "webpack --mode production", "ci": "npm run lint && npm run build", @@ -19,9 +20,15 @@ }, "keywords": [ "eruda", + "vue", "plugin" ], - "author": "", + "author": "redhoodsu", + "license": "MIT", + "bugs": { + "url": "https://github.com/liriliri/eruda-vue/issues" + }, + "homepage": "https://github.com/liriliri/eruda-vue#readme", "devDependencies": { "@babel/core": "^7.21.3", "@babel/plugin-transform-runtime": "^7.21.0", diff --git a/src/back.js b/src/back.js index bd76006..5861e91 100644 --- a/src/back.js +++ b/src/back.js @@ -1,8 +1,9 @@ import { installHook } from '@back/hook' import { initBackend } from '@back' import { Bridge } from '@utils/bridge' +import { SharedData } from '@utils/shared-data' import createUrl from 'licia/createUrl' -import devtools from 'raw-loader!./devtools.js' +import devtools from 'raw-loader!./devtools.txt' installHook(window) @@ -17,6 +18,8 @@ export function initDevtools(iframe) { }) initBackend(bridge) + const devtoolsSrc = createUrl(devtools, { type: 'application/javascript' }) + const devtoolsUrl = createUrl( ` @@ -26,7 +29,7 @@ export function initDevtools(iframe) {
- + `, { @@ -37,3 +40,7 @@ export function initDevtools(iframe) { iframe.__vdevtools__injected = true iframe.src = devtoolsUrl } + +export function setTheme(value) { + SharedData.theme = value +} diff --git a/src/index.js b/src/index.js index 65da7fa..950a7ad 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,4 @@ -const { initDevtools } = require('./back') +const { initDevtools, setTheme } = require('./back') module.exports = function (eruda) { let { evalCss } = eruda.util @@ -15,6 +15,9 @@ module.exports = function (eruda) { const iframe = $el.find('.eruda-vue-devtools').get(0) initDevtools(iframe) + + setTheme(this._getTheme()) + eruda.get().config.on('change', this._onThemeChange) } show() { super.show() @@ -26,6 +29,14 @@ module.exports = function (eruda) { super.destroy() evalCss.remove(this._style) } + _getTheme() { + return eruda.util.isDarkTheme() ? 'dark' : 'light' + } + _onThemeChange = (name) => { + if (name === 'theme') { + setTheme(this._getTheme()) + } + } } return new Vue() diff --git a/vue-devtools b/vue-devtools index 7d73696..66d1820 160000 --- a/vue-devtools +++ b/vue-devtools @@ -1 +1 @@ -Subproject commit 7d73696802457138abe922e7e7f512868a84cd82 +Subproject commit 66d18207b45028411d1409da94776a494edba61a