WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
WeAreDevelopers LIVE • Mar 24, 2021

Vuejs and TypeScript- Working Together like Peanut Butter and Jelly

Rob Richardson

How do you handle untyped JavaScript libraries in a mature Vue and TypeScript project? Discover type integration strategies to safely bridge this gap without relying on risky escape hatches.

Pause
Mute Enter Fullscreen
#1 about 3 min

Comparing Vue to React and Angular

An overview of why Vue optimizes for developer productivity compared to Angular's tooling focus and React's complex state capabilities.

#2 about 2 min

Initializing a new Vue application via the CLI

How to use the Vue CLI to scaffold a new project and select features like Babel, TypeScript, and routing.

#3 about 5 min

Solving function calling errors with TypeScript

How TypeScript acts as a design-time superset of JavaScript to ensure you structure and call functions correctly.

#4 about 4 min

Annotating codebase files with explicit TypeScript constraints

Renaming JavaScript files to TypeScript and adding explicit type hints to interfaces and function parameters.

#5 about 4 min

Configuring Vue single-file components with TypeScript

How single-file Vue components leverage the TypeScript execution context alongside scoped CSS and HTML templates.

#6 about 4 min

Resolving type errors when installing Vuetify components

Troubleshooting typing issues that arise when importing external design libraries into a strict TypeScript project.

#7 about 4 min

Building interactive counter and form components

Creating interactive counter components and utilizing robust Vuetify text fields to implement input forms.

#8 about 4 min

Resolving form element errors via type casting

How to cast Vue references via the as syntax to tell the TypeScript compiler the expected HTML element type.

#9 about 4 min

Writing custom declaration files for Lodash

Creating a basic definition file to manually add missing TypeScript support for specific Lodash utility methods.

#10 about 2 min

Downloading community type definitions from DefinitelyTyped

Pulling complete interface definitions from the open-source DefinitelyTyped repository to gain vast type checking coverage quickly.

#11 about 5 min

Generating definitions for untyped Vue plugins

Running the TypeScript compiler in declaration mode to auto-generate a starter typings file for legacy Vue-compatible packages.

#12 about 4 min

Prioritized strategies for typing external JavaScript libraries

A prioritized development checklist for introducing strict types to external dependencies that lack out-of-the-box TypeScript compatibility.

#13 about 3 min

Deciding when to adopt or avoid TypeScript

Assessing why TypeScript excels in long-term source clarity but slows down prototyping that depends heavily on untyped dependencies.

Matching moments

1:33 min

Choosing Vue and GraphQL for strong typings

Abdelrahman Awad Abdelrahman Awad · World Congress 2025

2:00 min

The origins and early problems solved by TypeScript

Dani Coll Dani Coll · World Congress 2026 Europe

1:20 min

Core takeaways for end-to-end TypeScript development

Marco Podien Marco Podien · World Congress 2025

1:12 min

Choosing TypeScript for complex backend applications

Maximilian Otto Maximilian Otto · World Congress 2024

3:57 min

The importance of TypeScript in enterprise Svelte projects

Ivan Hofer · World Congress 2022

7:13 min

Evaluating benefits and trade-offs of using TypeScript

Phil Nash · World Congress 2023

More from WeAreDevelopers LIVE

WeAreDevelopers LIVE - Is CSS Catching Up to Flash? thumbnail
1:03:33
11 days ago

WeAreDevelopers LIVE - Is CSS Catching Up to Flash?

Chris Heilmann, Daniel Cranney, Bramus Van Damme

WeAreDevelopers LIVE - Project Chopin: Make Your Team and Agents Play Along thumbnail
1:21:17
19 days ago

WeAreDevelopers LIVE - Project Chopin: Make Your Team and Agents Play Along

Chris Heilmann, Daniel Cranney, Krzysztof Cieślak

Fake or News - AI Toothbrushes, Carrier Pigeon Tech & Life on Mars - Krzysztof Cieślak thumbnail
4:23
20 days ago

Fake or News - AI Toothbrushes, Carrier Pigeon Tech & Life on Mars - Krzysztof Cieślak

Chris Heilmann, Daniel Cranney

WeAreDevelopers LIVE - Open Source Agent Toolkits thumbnail
1:00:38
25 days ago

WeAreDevelopers LIVE - Open Source Agent Toolkits

Chris Heilmann, Daniel Cranney, Eddie Jaoude

Fake or News - AI Music Detectors, Translating Ancient Languages & Tiny Heads in Teslas - Eddie Jaoude thumbnail
6:16
27 days ago

Fake or News - AI Music Detectors, Translating Ancient Languages & Tiny Heads in Teslas - Eddie Jaoude

Chris Heilmann, Daniel Cranney

Fake or News: AI Agents Hire Each Other, Spider-Man Ads in Cars & RAM Thieves - Marc Plogas thumbnail
5:46
about 1 month ago

Fake or News: AI Agents Hire Each Other, Spider-Man Ads in Cars & RAM Thieves - Marc Plogas

Chris Heilmann, Daniel Cranney, Marc Plogas

Related videos

Do TypeScript without TypeScript thumbnail
43:27
JS Congress • almost 5 years ago

Do TypeScript without TypeScript

Simone Sanfratello

Don't compromise on speedy delivery nor type-safety by choosing TypeScript thumbnail
29:44
World Congress 2023 • about 3 years ago

Don't compromise on speedy delivery nor type-safety by choosing TypeScript

Jens Claes

TDD for Vue.js Developers thumbnail
58:26
LIVE • over 3 years ago

TDD for Vue.js Developers

Markus Oberlehner

Svelte ♥ TypeScript and so will you thumbnail
28:20
World Congress 2022 • over 4 years ago

Svelte ♥ TypeScript and so will you

Ivan Hofer

End-to-End TypeScript: Completing the Modern Development Stack thumbnail
29:17
World Congress 2025 • about 1 year ago

End-to-End TypeScript: Completing the Modern Development Stack

Marco Podien

Building software that scales with Typescript thumbnail
37:18
World Congress 2022 • over 4 years ago

Building software that scales with Typescript

Tal Joffe

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.