How to Install Open-WC on Windows

Open-WC

This is a tutorial on how to install Open-WC on Windows and will cover IDE setup, Node.js/npm setup, yarn, and an open-wc boilerplate. Let's get started!

Step 1: IDE

In this tutorial, we will be using VSCode. To install VSCode use this link and download the correct version for your computer. If you are unsure which bit option to download, press the Windows key and search system information to figure out which is the right one for your setup.

Step 2: Node.js & NPM

Use this website link and download the latest LTS version of Node.js that corresponds to your 32 or 64-bit processor.

Once the setup wizard finishes installing this onto your computer, if you want to confirm which version downloaded, open up the terminal/command prompt or Windows PowerShell and enter the following:
node -v

NPM should also have been downloaded, to confirm the version installation enter the following:
npm -v

Step 3: yarn

In order to install yarn we will be utilizing npm. Open the terminal and enter the following:
npm install -g yarn

Step 4: Open-WC Boilerplate

Open your terminal and navigate to the location/folder where you would like to create this project. Once you are in the desired folder, enter the following:

npm init @open-wc

Once complete you should see this:

Press enter to select "Scaffold a new project".
Press enter to select "Web Component".
Use the spacebar to select all three options "Linting", "Testing" and "Demoing", then press enter.
Press enter to select "No" for typescript.
Now set the name for your project, in my example I used "hello-world".
Press enter to select "Yes" to write the file to disk.
Now select "Yes, with yarn" and press enter in order to install dependencies (this part may take a while).