Upgrading packages and fixing type issues

.gitignore

@@ -1,2 +1,2 @@
-*.js
-node_modules
+/node_modules/
+/lib/**/*.js

babel.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  presets: [
+    ['@babel/preset-env', {targets: {node: 'current'}}],
+    '@babel/preset-typescript',
+  ]
+};

lib/convertScopeToModuleName.ts

@@ -1,4 +1,4 @@
-import * as camelCase from "camelcase";
+import camelCase from "camelcase";
 
 export function convertScopeToModuleName(scope: string) {
     return camelCase(scope)

lib/convertScopedCssForEmotion.ts

@@ -1,5 +1,6 @@
-import * as postcss from "postcss";
-import * as Stringifier from "postcss/lib/stringifier";
+import {parse} from "postcss";
+import {stringify} from "postcss";
+import type {AnyNode} from "postcss";
 
 import { convertSelectorForEmotion } from "./convertSelectorForEmotion";
 import { escapeScopedCss } from "./escapeScopedCss";
@@ -13,7 +14,7 @@ export function convertScopedCssForEmotion(
 
     function builder(
         output: string,
-        node?: postcss.Node,
+        node?: AnyNode,
         flag?: "start" | "end",
     ) {
         if (
@@ -50,9 +51,7 @@ export function convertScopedCssForEmotion(
         scopedCssForEmotion += output;
     }
 
-    (new Stringifier(builder) as postcss.Stringifier).stringify(
-        postcss.parse(scopedCss),
-    );
+    stringify(parse(scopedCss), builder)
 
     return escapeScopedCss(scopedCssForEmotion);
 }

lib/convertSelectorForEmotion.ts

@@ -1,5 +1,4 @@
-import * as parseSelector from "postcss-selector-parser";
-
+import parseSelector from "postcss-selector-parser";
 import { convertScopeToModuleName } from "./convertScopeToModuleName";
 
 export function convertSelectorForEmotion(

lib/getCssIndexedByScope.ts

@@ -1,5 +1,6 @@
-import * as postcss from "postcss";
-import * as Stringifier from "postcss/lib/stringifier";
+import {parse} from "postcss";
+import {stringify} from "postcss";
+import type {AnyNode} from "postcss";
 
 import { getNodeScopes } from "./getNodeScopes";
 import { getSelectorScope } from "./getSelectorScope";
@@ -11,7 +12,7 @@ export function getCssIndexedByScope(css: string): Map<string, string> {
 
     function builder(
         output: string,
-        node?: postcss.Node,
+        node?: AnyNode,
         flag?: "start" | "end",
     ) {
         if (flag === "start" && node) {
@@ -31,8 +32,8 @@ export function getCssIndexedByScope(css: string): Map<string, string> {
                 flag === "start" &&
                 node &&
                 node.type === "rule" &&
-                (node.parent.type !== "atrule" ||
-                    /keyframes$/.test(node.parent.name) === false)
+                (node.parent && (node.parent.type !== "atrule" ||
+                    /keyframes$/.test(node.parent.name) === false))
             ) {
                 output = `${(node.selectors || [])
                     .filter(
@@ -48,9 +49,7 @@ export function getCssIndexedByScope(css: string): Map<string, string> {
         }
     }
 
-    (new Stringifier(builder) as postcss.Stringifier).stringify(
-        postcss.parse(css),
-    );
+    stringify(parse(css), builder)
 
     return cssIndexedByScope;
 }

lib/getNodeScopes.ts

@@ -1,14 +1,13 @@
-import * as postcss from "postcss";
-
+import type {AnyNode} from "postcss";
 import { getSelectorScope } from "./getSelectorScope";
 
-export function getNodeScopes(node: postcss.Node): Set<string> {
+export function getNodeScopes(node: AnyNode): Set<string> {
     const nodeScopes = new Set();
 
     if (
         node.type === "rule" &&
-        (node.parent.type !== "atrule" ||
-            /keyframes/.test(node.parent.name) === false)
+        (node.parent && (node.parent.type !== "atrule" ||
+            /keyframes/.test(node.parent.name) === false))
     ) {
         (node.selectors || []).forEach((selector) => {
             nodeScopes.add(getSelectorScope(selector));

lib/getRequiredScopes.ts

@@ -1,20 +1,22 @@
-import * as postcss from "postcss";
-import * as parseSelector from "postcss-selector-parser";
+import { parse } from "postcss";
+import parse from "postcss-selector-parser";
+import { Container, ClassName } from "postcss-selector-parser";
 
 import { getSelectorScope } from "./getSelectorScope";
 
+
 export function getRequiredScopes(
     css: string,
     scope: string,
     knownScopes: Set<string>,
 ): Set<string> {
     const requiredScopes = new Set();
 
-    const root = postcss.parse(css);
+    const root = parse(css);
     root.walkRules((rule) => {
-        parseSelector((nodes: any) => {
-            nodes.walkClasses((node: any) => {
-                const selectorScope = getSelectorScope(node.toString());
+        parse((selectors: Container) => {
+            selectors.walkClasses((className: ClassName) => {
+                const selectorScope = getSelectorScope(className.toString());
                 if (selectorScope === scope) {
                     return;
                 }

lib/getSelectorScope.ts

@@ -1,4 +1,4 @@
-import * as parseSelector from "postcss-selector-parser";
+import parseSelector from "postcss-selector-parser";
 
 export function getSelectorScope(selector: string): string {
     let selectorScope = "root";