Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Convert project to TypeScript

See original GitHub issue

Hi 👋 ,

I was about to create a draft PR but I’ve noticed you’ve merged my fork into a new branch. I’ve created this issue to give you a heads up and also a run down of the changes.

Heads up:

I’m waiting on a new release from plyr since I fixed a type issue yesterday. Also, I’m still testing this is in a Next.js project so I’ll let you know if everything works on my end.

The rundown:

  • The project is written in Typescript and uses the types from the official repo. Fixes #201
  • plyr-react was not Next.js friendly since it imported the css styles within the component and that is no longer supported. Users will need to import the styles manually. Fixes #162
  • The component separates the source prop from options prop since original Options type does not include source.
  • Configuration files are simplified. It’s best to keep things simple but feel free to change it.

Thank you.


Plyr seems to work correctly with the latest version of Next.js.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:1
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

chintan9commented, Sep 25, 2020
iwatakeshicommented, Jul 29, 2020

The PR has already been merged. I’m not sure if @chintan9 wants to make the changes I’ve mentioned here, but if he does then that’s all that needs to be done…I think.

@chintan9 You could publish the package as alpha and see if things work, even though we’re waiting on a new Plyr release. You’ll just have to add to the docs that the types for Source is incorrect so the developer needs to use any to remove the warnings:

<Plyr source={source as any} />

Maybe the one thing that comes to mind is that Plyr (the package) is globally available and therefore shadows the component’s type def (Plyr), I’m thinking we should add a new type def (plyr.d.ts or react-plyr.d.ts) that looks something like this:

import Plyr from '...'

declare module "plyr-react" {
  export Plyr

Then, just change the types property in package.json to point to that file… I think.

I’ll leave it up to you to decide.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Documentation - Migrating from JavaScript - TypeScript
If you're looking to convert a React project, we recommend looking at the React Conversion Guide first. Setting up your Directories. If you're...
Read more >
Converting a Javascript project to Typescript - Medium
You can do so by running the following command in the root directory of your project. npm install --save-dev typescript ts-loader. Step 2: ......
Read more >
Converting JavaScript to TypeScript - TutorialsTeacher
Converting Existing JavaScript to TypeScript · Add tsconfig.json file to project · Integrate with a build tool · Change all .js files to...
Read more >
8 Tips for Converting That Big Project to TypeScript
The hybrid method allows your team to migrate to TypeScript without stopping the development process. Use the allowJs compiler option to add new ......
Read more >
How to Migrate Application From JavaScript to TypeScript
TypeScript is a superset of JavaScript, so valid JavaScript code is a valid TypeScript code. Incremental migration, converting the whole project step by...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found