增加scss支持

README.md

@@ -1,2 +1,18 @@
 ## string-html-css
-一个高亮js代码中的 html/css/scss/sass/less的字符串, 并支持emmet.
+一个高亮js代码中的 html/css/scss/sass/less的字符串, 并支持emmet.
+
+```js
+
+const foo = css`
+  .foo { color: red }
+`
+
+const foo = scss`
+  .foo { color: red }
+`
+
+const foo = html`
+  <div>hello</div>
+`
+
+```

src/providers/css.ts

@@ -131,7 +131,8 @@ export class HTMLStyleCompletionItemProvider implements CompletionItemProvider {
 
 export class CSSCompletionItemProvider implements CompletionItemProvider {
   private _CSSLanguageService: CSSLanguageService = GetCSSLanguageService()
-  private _expression = /(\/\*\s*(css|less|scss)\s*\*\/\s*`|css\s*`)([^`]*)(`)/g
+  private _expression =
+    /(\/\*\s*(css|less|scss|sass)\s*\*\/\s*`|(scss|sass|less|css)\s*`)([^`]*)(`)/g
   private _cache = new CompletionsCache()
 
   public provideCompletionItems(

src/util.ts

@@ -54,10 +54,7 @@ export function MatchOffset(
   return null
 }
 
-export function Match(
-  regex: RegExp,
-  data: string
-): RegExpMatchArray {
+export function Match(regex: RegExp, data: string): RegExpMatchArray {
   regex.exec(null)
 
   let match: RegExpExecArray
@@ -115,9 +112,15 @@ export function TranslateHTMLTextEdits(
   offset: number
 ): TextEdit[] {
   return input.map((item: HTMLTextEdit) => {
-    const startPosition = new Position(item.range.start.line + offset, item.range.start.character);
-    const endPosition = new Position(item.range.end.line + offset - 1, item.range.end.character);
-    const itemRange = new Range(startPosition, endPosition);
+    const startPosition = new Position(
+      item.range.start.line + offset,
+      item.range.start.character
+    )
+    const endPosition = new Position(
+      item.range.end.line + offset - 1,
+      item.range.end.character
+    )
+    const itemRange = new Range(startPosition, endPosition)
     return new TextEdit(itemRange, item.newText)
   })
 }

syntaxes/es6.inline.css.json

@@ -1,15 +1,10 @@
 {
-  "fileTypes": [
-    "js",
-    "jsx",
-    "ts",
-    "tsx"
-  ],
+  "fileTypes": ["js", "jsx", "ts", "tsx"],
   "injectionSelector": "L:source.js -comment -string, L:source.jsx -comment -string, L:source.ts -comment -string, L:source.tsx -comment -string",
   "patterns": [
     {
       "contentName": "meta.embedded.block.css",
-      "begin": "(?x)(\\s*?(\\w+\\.)?(?:css|\/\\*\\s*css\\s*\\*\/)\\s*)(`)",
+      "begin": "(?x)(\\s*?(\\w+\\.)?(?:css|/\\*\\s*css\\s*\\*/)\\s*)(`)",
       "beginCaptures": {
         "0": {
           "name": "string.template.ts, punctuation.definition.string.template.begin.ts"
@@ -38,4 +33,4 @@
     }
   ],
   "scopeName": "es6.inline.css"
-}
+}

syntaxes/es6.inline.html.json

@@ -1,10 +1,5 @@
 {
-  "fileTypes": [
-    "js",
-    "jsx",
-    "ts",
-    "tsx"
-  ],
+  "fileTypes": ["js", "jsx", "ts", "tsx"],
   "injectionSelector": "L:source.js -comment -string, L:source.jsx -comment -string, L:source.ts -comment -string, L:source.tsx -comment -string",
   "injections": {
     "L:source": {
@@ -19,7 +14,7 @@
   "patterns": [
     {
       "contentName": "meta.embedded.block.html",
-      "begin": "(?x)(\\s*?(\\w+\\.)?(?:html|\/\\*\\s*html\\s*\\*\/)\\s*)(`)",
+      "begin": "(?x)(\\s*?(\\w+\\.)?(?:html|/\\*\\s*html\\s*\\*/)\\s*)(`)",
       "beginCaptures": {
         "0": {
           "name": "string.template.ts, punctuation.definition.string.template.begin.ts"
@@ -48,4 +43,4 @@
     }
   ],
   "scopeName": "es6.inline.html"
-}
+}

syntaxes/es6.inline.less.json

@@ -1,15 +1,10 @@
 {
-  "fileTypes": [
-    "js",
-    "jsx",
-    "ts",
-    "tsx"
-  ],
+  "fileTypes": ["js", "jsx", "ts", "tsx"],
   "injectionSelector": "L:source.js -comment -string, L:source.jsx -comment -string, L:source.ts -comment -string, L:source.tsx -comment -string",
   "patterns": [
     {
       "contentName": "meta.embedded.block.css",
-      "begin": "(?x)(\\s*?(\\w+\\.)?(?:\/\\*\\s*less\\s*\\*\/)\\s*)(`)",
+      "begin": "(?x)(\\s*?(\\w+\\.)?(?:less|/\\*\\s*less\\s*\\*/)\\s*)(`)",
       "beginCaptures": {
         "0": {
           "name": "string.template.ts, punctuation.definition.string.template.begin.ts"
@@ -38,4 +33,4 @@
     }
   ],
   "scopeName": "es6.inline.less"
-}
+}

syntaxes/es6.inline.scss.json

@@ -1,15 +1,10 @@
 {
-  "fileTypes": [
-    "js",
-    "jsx",
-    "ts",
-    "tsx"
-  ],
+  "fileTypes": ["js", "jsx", "ts", "tsx"],
   "injectionSelector": "L:source.js -comment -string, L:source.jsx -comment -string, L:source.ts -comment -string, L:source.tsx -comment -string",
   "patterns": [
     {
       "contentName": "meta.embedded.block.css",
-      "begin": "(?x)(\\s*?(\\w+\\.)?(?:\/\\*\\s*scss\\s*\\*\/)\\s*)(`)",
+      "begin": "(?x)(\\s*?(\\w+\\.)?(?:scss|/\\*\\s*scss\\s*\\*/)\\s*)(`)",
       "beginCaptures": {
         "0": {
           "name": "string.template.ts, punctuation.definition.string.template.begin.ts"
@@ -38,4 +33,4 @@
     }
   ],
   "scopeName": "es6.inline.scss"
-}
+}