0.0.13 • Published 2 years ago
@pequity/squirrel-poc v0.0.13
Pequity Squirrel component library
VS Code setup
Install Volar
For Vue 3 development we need a newer VS Code extension.
You can search for "Volar" in VS Code extensions (cmd+shift+x)
or navigate to "https://marketplace.visualstudio.com/items?itemName=Vue.volar and install it from there.
Create a new workspace just for squirrel
Since this is a Vue 3 project, we have create a new separate workspace for it, so that tools like Vue language features (Volar), ESLint, Prettier etc, work as expected.
- File -> Open folder -> point to
{path_to_pequity_project}/squirrel - File -> Save Workspace As... -> save it to your favorite location as e.g
squirrel.code-workspace
Disable Vetur for this workspace
We need to disable Vetur (the Vue language extension for Vue 2) so that Volar is able to take over.
- Navigate to VS Code extensions on the left panel (cmd+shift+x)
- Search for "Vetur", click on the found entry, a details view will display on the right pane.
- On the right pane click on the arrow on the right of the "Disable" dropdown and click "Disable (Workspace)" This will disable Vetur just for this workspace.
- Restart VS Code
VS Code workspace settings
Create squirrel/.vscode/settings.json with contents
{
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
}Project setup
npm installStart the dev server
npm run devCompile for production
npm run buildPreview the production build locally
npm run previewRun unit tests
npm run test:unitLint files
npm run lintLint and auto-fix files
npm run lint-fixRun typescript checks
npm run typecheckCustomize configuration
Adding path aliases
When a new path alias is required (e.g @/folder), it has to be added to the following files:
- tsconfig.app.json
- tsconfig.jest.json
- vite.config.ts