Skip to content

feat: vite plugin VueDevtools #460

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 14 commits into from
Mar 11, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,7 @@ jobs:
flag-for-pinia: '--pinia'
flag-for-vitest: '--vitest'
flag-for-e2e: '--cypress'
flag-for-devtools: '--devtools'

- node-version: 18
os: macos-latest
Expand All @@ -77,6 +78,7 @@ jobs:
flag-for-pinia: '--pinia'
flag-for-vitest: '--vitest'
flag-for-e2e: '--cypress'
flag-for-devtools: '--devtools'

- node-version: 20
os: ubuntu-latest
Expand All @@ -86,6 +88,7 @@ jobs:
flag-for-pinia: '--pinia'
flag-for-vitest: '--vitest'
flag-for-e2e: '--cypress'
flag-for-devtools: '--devtools'

- node-version: 16
os: ubuntu-latest
Expand All @@ -95,10 +98,11 @@ jobs:
flag-for-pinia: '--pinia'
flag-for-vitest: '--vitest'
flag-for-e2e: '--cypress'
flag-for-devtools: '--devtools'
runs-on: ${{ matrix.os }}
continue-on-error: ${{ matrix.os == 'windows-latest' }}
env:
FEATURE_FLAGS: ${{ matrix.flag-for-ts }} ${{ matrix.flag-for-jsx }} ${{ matrix.flag-for-router }} ${{ matrix.flag-for-pinia }} ${{ matrix.flag-for-vitest }} ${{ matrix.flag-for-e2e }}
FEATURE_FLAGS: ${{ matrix.flag-for-ts }} ${{ matrix.flag-for-jsx }} ${{ matrix.flag-for-router }} ${{ matrix.flag-for-pinia }} ${{ matrix.flag-for-vitest }} ${{ matrix.flag-for-e2e }} ${{matrix.flag-for-devtools}}
# Sometimes the Linux runner can't verify Cypress in 30s
CYPRESS_VERIFY_TIMEOUT: 60000
steps:
Expand Down
29 changes: 24 additions & 5 deletions index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,7 @@ async function init() {
// --playwright
// --eslint
// --eslint-with-prettier (only support prettier through eslint for simplicity)
// --vue-devtools / --devtools
// --force (for force overwriting)

const args = process.argv.slice(2)
Expand All @@ -94,7 +95,9 @@ async function init() {
'with-tests': { type: 'boolean' },
tests: { type: 'boolean' },
'vue-router': { type: 'boolean' },
router: { type: 'boolean' }
router: { type: 'boolean' },
'vue-devtools': { type: 'boolean' },
devtools: { type: 'boolean' }
} as const

const { values: argv } = parseArgs({
Expand All @@ -116,7 +119,8 @@ async function init() {
argv.cypress ??
argv.nightwatch ??
argv.playwright ??
argv.eslint
argv.eslint ??
(argv.devtools || argv['vue-devtools'])
) === 'boolean'

let targetDir = args[0]
Expand All @@ -138,6 +142,7 @@ async function init() {
needsE2eTesting?: false | 'cypress' | 'nightwatch' | 'playwright'
needsEslint?: boolean
needsPrettier?: boolean
needsDevTools?: boolean
} = {}

try {
Expand All @@ -154,6 +159,7 @@ async function init() {
// - Add Playwright for end-to-end testing?
// - Add ESLint for code quality?
// - Add Prettier for code formatting?
// - Add Vue DevTools extension for debugging? (experimental)
result = await prompts(
[
{
Expand Down Expand Up @@ -285,6 +291,14 @@ async function init() {
initial: false,
active: language.defaultToggleOptions.active,
inactive: language.defaultToggleOptions.inactive
},
{
name: 'needsDevTools',
type: () => (isFeatureFlagsUsed ? null : 'toggle'),
message: language.needsDevTools.message,
initial: false,
active: language.defaultToggleOptions.active,
inactive: language.defaultToggleOptions.inactive
}
],
{
Expand All @@ -305,12 +319,13 @@ async function init() {
packageName = projectName ?? defaultProjectName,
shouldOverwrite = argv.force,
needsJsx = argv.jsx,
needsTypeScript = argv.typescript,
needsRouter = argv.router,
needsTypeScript = argv.ts || argv.typescript,
needsRouter = argv.router || argv['vue-router'],
needsPinia = argv.pinia,
needsVitest = argv.vitest || argv.tests,
needsEslint = argv.eslint || argv['eslint-with-prettier'],
needsPrettier = argv['eslint-with-prettier']
needsPrettier = argv['eslint-with-prettier'],
needsDevTools = argv.devtools || argv['vue-devtools']
} = result

const { needsE2eTesting } = result
Expand Down Expand Up @@ -453,6 +468,10 @@ async function init() {
if (needsPrettier) {
render('config/prettier')
}

if (needsDevTools) {
render('config/devtools')
}
// Render code template.
// prettier-ignore
const codeTemplate =
Expand Down
3 changes: 3 additions & 0 deletions locales/en-US.json
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,9 @@
"needsPrettier": {
"message": "Add Prettier for code formatting?"
},
"needsDevTools": {
"message": "Add Vue DevTools extension for debugging? (experimental)"
},
"errors": {
"operationCancelled": "Operation cancelled"
},
Expand Down
3 changes: 3 additions & 0 deletions locales/fr-FR.json
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,9 @@
"needsPrettier": {
"message": "Ajouter Prettier pour le formatage du code\u00a0?"
},
"needsDevTools": {
"message": "Ajouter l'extension Vue DevTools pour le débogage\u00a0? (expérimental)"
},
"errors": {
"operationCancelled": "Operation annulée"
},
Expand Down
3 changes: 3 additions & 0 deletions locales/tr-TR.json
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,9 @@
"needsPrettier": {
"message": "Kod formatlama için Prettier eklensin mi?"
},
"needsDevTools": {
"message": "Add Vue DevTools extension for debugging? (experimental)"
},
"errors": {
"operationCancelled": "İşlem iptal edildi"
},
Expand Down
3 changes: 3 additions & 0 deletions locales/zh-Hans.json
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,9 @@
"needsPrettier": {
"message": "是否引入 Prettier 用于代码格式化?"
},
"needsDevTools": {
"message": "Add Vue DevTools extension for debugging? (experimental)"
},
"errors": {
"operationCancelled": "操作取消"
},
Expand Down
3 changes: 3 additions & 0 deletions locales/zh-Hant.json
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,9 @@
"needsPrettier": {
"message": "是否引入 Prettier 用於程式碼格式化?"
},
"needsDevTools": {
"message": "Add Vue DevTools extension for debugging? (experimental)"
},
"errors": {
"operationCancelled": "操作取消"
},
Expand Down
Loading