tech.thiscalifornianlife.com Open in urlscan Pro
219.94.128.171 Public Scan

Back to summary

URL:
https://tech.thiscalifornianlife.com/install-code-formatter-prettier-on-vscode/
Submission: On February 07 via api (February 7th 2024, 9:59:12 am UTC) from US — Scanned from JP

Form analysis
2 forms found in the DOM

POST https://tech.thiscalifornianlife.com/wp-comments-post.php

<form action="https://tech.thiscalifornianlife.com/wp-comments-post.php" method="post" id="commentform" class="comment-form">
  <p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> Required fields are marked <span class="required">*</span></p>
  <p class="comment-form-comment"><label for="comment">Comment</label><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true" style="overflow: hidden; overflow-wrap: break-word; resize: none; height: 154px;"></textarea></p>
  <div id="commentform-author">
    <p class="comment-form-author"><label for="author">Name <span class="required">*</span></label><input id="author" name="author" type="text" value="" size="30" maxlength="245" aria-required="true"></p>
    <p class="comment-form-email"><label for="email">Email <span class="required">*</span></label><input id="email" name="email" type="text" value="" size="30" maxlength="100" aria-describedby="email-notes" aria-required="true"></p>
  </div>
  <p class="comment-form-url"><label for="url">Website</label><input id="url" name="url" type="text" value="" size="30" maxlength="200"></p>
  <p class="comment-form-captcha">Captcha <span class="required">*</span></p>
  <p class="comment-form-captcha-img" style="white-space:nowrap"><img id="captcha"
      src="//tech.thiscalifornianlife.com/wp-content/themes/luxeritas/captcha.php?iw=170&amp;ih=45&amp;sl=4&amp;el=6&amp;ch=alphanum_lower&amp;fr=75&amp;cl=000000&amp;bg=d3d3d3&amp;pb=75&amp;nl=60&amp;nc=808080&amp;ln=1&amp;lc=f5f5f5" width="170"
      height="45"
      alt="CAPTCHA Image"><a href="#" onclick="document.getElementById('captcha').src = '//tech.thiscalifornianlife.com/wp-content/themes/luxeritas/captcha.php?iw=170&amp;ih=45&amp;sl=4&amp;el=6&amp;ch=alphanum_lower&amp;fr=75&amp;cl=000000&amp;bg=d3d3d3&amp;pb=75&amp;nl=60&amp;nc=808080&amp;ln=1&amp;lc=f5f5f5&amp;' + Math.random(); return false"><i class="fas fa-sync-alt" aria-hidden="true" style="font-size:32px;margin-left:10px;vertical-align:middle"></i></a>
  </p>
  <p class="comment-form-captcha-code"><input id="captcha_code" type="text" placeholder="Enter Captcha" name="captcha_code" value="" size="12" aria-required="true"></p>
  <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"><label for="wp-comment-cookies-consent">Save my name, email, and website in this browser for the next time
      I comment.</label></p>
  <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Post Comment"><input type="hidden" name="comment_post_ID" value="306" id="comment_post_ID"><input type="hidden" name="comment_parent" id="comment_parent"
      value="0"></p>
</form>

GET https://tech.thiscalifornianlife.com/

<form itemprop="potentialAction" itemscope="" itemtype="https://schema.org/SearchAction" method="get" class="search-form" action="https://tech.thiscalifornianlife.com/">
  <meta itemprop="target" content="https://tech.thiscalifornianlife.com/?s={s}">
  <div><input itemprop="query-input" type="search" class="search-field mobile-search" name="s" placeholder="  Search for ..." required=""></div><input type="submit" class="search-submit" value="Search">
</form>

Text Content

Tech - This Californian Life

For developers, engineers, and more!

* Development
* Golang
* How to Install Golang in Ubuntu 20.0.4
* React Native
* React Native: Save Image File on Local Filesystem or Send it to the
Server with REST API.
* Which is Better? Expo CLI Tool or React Native CLI
* How To Use Expo CLI Tool
* Visual Studio Code
* Install Code Formatter “Prettier” on VSCode
* Useful Shortcuts for Visual Studio Code
* Infrastructure
* CentOS
* How To Add Swap File on CentOS
* Perfect Cheat Sheet for Port Forwarding with iptables
* Docker
* Docker on Ubuntu 20.04LTS Quick Start Guide
* Docker – Create Containers Quick Start Guide
* How To Change Timezone on Docker Containers
* Manage Docker Containers by shell without SSH Login
* Troubleshoot: Port Range Forwarding with -p Option is Unstable on Docker.
* mongodb
* How to Set “OR”, “AND”, “SORT”, “LIMIT” Operator in Mongoose + MongoDB
* MySQL
* Install MySQL 8.0 on CentOS8
* Troubleshooting : Accidentally Shutdown MySQL 5.7 Once a Month
* Nginx
* How To Install Nginx on Ubuntu 20.04
* How To Setup HTTP Reverse Proxy with Nginx
* How To Terminate HTTPS at the Nginx Reverse Proxy Server
* Setup Debug Log on Nginx
* Ubuntu
* How To Change Timezone on Ubuntu
* How To Connect from Windows 10 to Ubuntu 20.04 via Remote Desktop
* How To Setup Samba on Ubuntu 20.0.4
* How to Setup Static IP address on Ubuntu20.04 Server
* How To Get Let’s Encrypt Certificate on Ubuntu 20.04
* VirtualBox
* Virtual Box : How to enable “Nested VT-x/AMD-V” of the Processor
* Security
* Firewall
* Perfect Cheat Sheet for Port Forwarding with iptables
* Drone
* Tello
* TELLO EDU DRONE Quick Start Guide
* Services
* Firebase
* Firebase Realtime Database : Filter with REST API doesn’t work

* Menu

* Sidebar

* Prev

* Next

* Search

1. Home>
2. Development>
3. Visual Studio Code

INSTALL CODE FORMATTER “PRETTIER” ON VSCODE

10/08/202010/10/2020Visual Studio CodeVSCode

* Twitter

* Facebook

* Pin it

* LinkedIn

* Pocket

* Copy

Contents
* 1. What is “Prettier"
* 2. How to install Prettier on VSCode.
* 3. Configuration of the .prettierrc file.
* 4. If Your Prettier Doesn’t Work…

WHAT IS “PRETTIER"

Prettier is a code formatter and can work on Visual Studio Code as an extension.

By using this tool, your code is automatically formatted when you save it.

HOW TO INSTALL PRETTIER ON VSCODE.

You can install it on [File] > [Preferences] > [Extensions].

Search “Prettier". Then install it.

CONFIGURATION OF THE .PRETTIERRC FILE.

Create a .prettierrc under your project directory and edit it.

Example of “.prettierrc" file.

{
"printWidth": 100,
"semi": true,
"singleQuote": true,
"tabWidth": 2
}

JSON
Copy

IF YOUR PRETTIER DOESN’T WORK…

Please check Default Formatter setting.

Visual Studio CodeVSCode

Posted by Kei

--------------------------------------------------------------------------------

PLEASE SHARE THIS IF YOU LIKED IT!