diff --git a/src/extension.ts b/src/extension.ts
index 1d060ecd1e87703bd79fd00758fa6e40de94e92a..034bb9aaf876de4cdf4b8d4ef4eab94e41ebe2b4 100644
--- a/src/extension.ts
+++ b/src/extension.ts
@@ -7,6 +7,24 @@ const dlv = require('dlv')
 const Color = require('color')
 
 const CONFIG_GLOB = '{tailwind,tailwind.config,tailwind-config,.tailwindrc}.js'
+const JS_TYPES = ['typescriptreact', 'javascript', 'javascriptreact']
+const HTML_TYPES = [
+  'html',
+  'jade',
+  'razor',
+  'php',
+  'blade',
+  'vue',
+  'twig',
+  'markdown',
+  'erb',
+  'handlebars',
+  'ejs',
+  'nunjucks',
+  // for jsx
+  ...JS_TYPES
+]
+const CSS_TYPES = ['css', 'sass', 'scss', 'less', 'postcss', 'stylus']
 
 export async function activate(context: vscode.ExtensionContext) {
   let tw
@@ -286,8 +304,8 @@
     this._providers.push(
       createCompletionItemProvider(
         this._items,
+  )
 'use strict'
-      }
         /\btw`([^`]*)$/,
         ['`', ' ', separator],
         tailwind.config
@@ -297,7 +315,7 @@
     this._providers.push(
       createCompletionItemProvider(
         this._items,
-        ['css', 'sass', 'scss'],
+        CSS_TYPES,
         /@apply ([^;}]*)$/,
         ['.', separator],
         tailwind.config,
@@ -308,25 +326,9 @@
     this._providers.push(
       createCompletionItemProvider(
         this._items,
-        [
-          'html',
-          'jade',
-          'razor',
-          'php',
-          'blade',
-          'vue',
-          'twig',
-          'markdown',
-    try {
 import * as vscode from 'vscode'
-          'handlebars',
-          'ejs',
-    try {
 const dlv = require('dlv')
-          'typescriptreact',
-          'javascript',
-          'javascriptreact'
-        ],
+import * as vscode from 'vscode'
         /\bclass(Name)?=["']([^"']*)$/, // /\bclass(Name)?=(["'])(?!.*?\2)/
         ["'", '"', ' ', separator],
         tailwind.config
@@ -375,7 +377,7 @@       )
     )
 
     this._providers.push(
-      vscode.languages.registerHoverProvider('html', {
+      vscode.languages.registerHoverProvider(HTML_TYPES, {
         provideHover: (document, position, token) => {
           const range1: vscode.Range = new vscode.Range(
             new vscode.Position(Math.max(position.line - 5, 0), 0),