feat: support .cts (#252)

add support for loading cts files

Author: sapphi-red

README.md

@@ -91,16 +91,18 @@ In this case create JS file named:
 - `.postcssrc.mjs`
 - `.postcssrc.cjs`
 - `.postcssrc.ts`
+- `.postcssrc.cts`
 - `postcss.config.js`
 - `postcss.config.mjs`
 - `postcss.config.cjs`
 - `postcss.config.ts`
+- `postcss.config.cts`
 
 ```
 Project (Root)
   |– client
   |– public
-  |- (.postcssrc|postcss.config).(js|mjs|cjs|ts)
+  |- (.postcssrc|postcss.config).(js|mjs|cjs|ts|cts)
   |- package.json
 ```
 

package.json

@@ -65,7 +65,7 @@
     "exclude": [
       "**/*.test.*"
     ],
-    "lines": 97.64,
+    "lines": 97.8,
     "check-coverage": true
   },
   "prettier": {

src/index.js

@@ -85,10 +85,12 @@ const addTypeScriptLoader = (options = {}, loader) => {
       `.${moduleName}rc.yaml`,
       `.${moduleName}rc.yml`,
       `.${moduleName}rc.ts`,
+      `.${moduleName}rc.cts`,
       `.${moduleName}rc.js`,
       `.${moduleName}rc.cjs`,
       `.${moduleName}rc.mjs`,
       `${moduleName}.config.ts`,
+      `${moduleName}.config.cts`,
       `${moduleName}.config.js`,
       `${moduleName}.config.cjs`,
       `${moduleName}.config.mjs`
@@ -100,7 +102,8 @@ const addTypeScriptLoader = (options = {}, loader) => {
       '.js': importDefault,
       '.cjs': importDefault,
       '.mjs': importDefault,
-      '.ts': loader
+      '.ts': loader,
+      '.cts': loader
     }
   }
 }
@@ -112,7 +115,10 @@ const withTypeScriptLoader = (rcFunc) => {
 
       try {
         // Register TypeScript compiler instance
-        registerer = require('ts-node').register()
+        registerer = require('ts-node').register({
+          // transpile to cjs even if compilerOptions.module in tsconfig is not Node16/NodeNext.
+          moduleTypes: { '**/*.cts': 'cjs' }
+        })
 
         return require(configFile)
       } catch (err) {

test/ts.test.js

@@ -13,7 +13,17 @@ describe('postcss.config.ts - {Object} - Load Config', test => {
     syntax: true
   }
 
-  const expected = config => {
+  test('Load Config - postcss.config.ts (CommonJS)', async () => {
+    const config = await postcssrc(ctx, 'test/ts/object/cjs-in-ts')
+    assertExpectedConfig(config, 'test/ts/object/cjs-in-ts/postcss.config.ts')
+  })
+
+  test('Load Config - postcss.config.cts', async () => {
+    const config = await postcssrc(ctx, 'test/ts/object/cts')
+    assertExpectedConfig(config, 'test/ts/object/cts/postcss.config.cts')
+  })
+
+  function assertExpectedConfig (config, expectedPath) {
     is(config.options.parser, require('sugarss'))
     is(config.options.syntax, require('sugarss'))
     is(config.options.map, false)
@@ -24,13 +34,9 @@ describe('postcss.config.ts - {Object} - Load Config', test => {
     is(typeof config.plugins[0], 'function')
     is(typeof config.plugins[1], 'function')
 
-    is(config.file, path.resolve('test/ts/object', 'postcss.config.ts'))
+    is(config.file, path.resolve(expectedPath))
   }
 
-  test('Async', () => {
-    return postcssrc(ctx, 'test/ts/object').then(expected)
-  })
-
   test.run()
 })
 
@@ -40,7 +46,7 @@ test('postcss.config.ts - {Object} - Process CSS', () => {
     syntax: false
   }
 
-  return postcssrc(ctx, 'test/ts/object').then(config => {
+  return postcssrc(ctx, 'test/ts/object/cjs-in-ts').then(config => {
     return postcss(config.plugins)
       .process(fixture('ts/object', 'index.css'), config.options)
       .then(result => {
@@ -56,7 +62,7 @@ test('postcss.config.ts - {Object} - Process SSS', () => {
     syntax: false
   }
 
-  return postcssrc(ctx, 'test/ts/object').then(config => {
+  return postcssrc(ctx, 'test/ts/object/cjs-in-ts').then(config => {
     return postcss(config.plugins)
       .process(fixture('ts/object', 'index.sss'), config.options)
       .then(result => {
@@ -71,7 +77,17 @@ describe('postcss.config.ts - {Array} - Load Config', () => {
     syntax: true
   }
 
-  const expected = config => {
+  test('Load Config - postcss.config.ts (CommonJS)', async () => {
+    const config = await postcssrc(ctx, 'test/ts/array/cjs-in-ts')
+    assertExpectedConfig(config, 'test/ts/array/cjs-in-ts/postcss.config.ts')
+  })
+
+  test('Load Config - postcss.config.cts', async () => {
+    const config = await postcssrc(ctx, 'test/ts/array/cts')
+    assertExpectedConfig(config, 'test/ts/array/cts/postcss.config.cts')
+  })
+
+  function assertExpectedConfig (config, expectedPath) {
     is(config.options.parser, require('sugarss'))
     is(config.options.syntax, require('sugarss'))
     is(config.options.map, false)
@@ -82,13 +98,9 @@ describe('postcss.config.ts - {Array} - Load Config', () => {
     is(typeof config.plugins[0], 'object')
     is(typeof config.plugins[1], 'object')
 
-    is(config.file, path.resolve('test/ts/array', 'postcss.config.ts'))
+    is(config.file, path.resolve(expectedPath))
   }
 
-  test('Async', () => {
-    return postcssrc(ctx, 'test/ts/array').then(expected)
-  })
-
   test.run()
 })
 
@@ -98,7 +110,7 @@ test('postcss.config.ts - {Array} - Process CSS', () => {
     syntax: false
   }
 
-  return postcssrc(ctx, 'test/ts/array').then(config => {
+  return postcssrc(ctx, 'test/ts/array/cjs-in-ts').then(config => {
     return postcss(config.plugins)
       .process(fixture('ts/array', 'index.css'), config.options)
       .then(result => {
@@ -114,7 +126,7 @@ test('postcss.config.ts - {Array} - Process SSS', () => {
     syntax: false
   }
 
-  return postcssrc(ctx, 'test/ts/array').then(config => {
+  return postcssrc(ctx, 'test/ts/array/cjs-in-ts').then(config => {
     return postcss(config.plugins)
       .process(fixture('ts/array', 'index.sss'), config.options)
       .then(result => {

test/ts/array/postcss.config.ts test/ts/array/cjs-in-ts/postcss.config.tstest/ts/array/postcss.config.ts renamed to test/ts/array/cjs-in-ts/postcss.config.ts

@@ -0,0 +1,19 @@
+import postcssImport from 'postcss-import';
+import postcssNested from 'postcss-nested';
+import cssnano from 'cssnano';
+import { ConfigFn } from '../../../src';
+
+const config: ConfigFn = ctx => ({
+  parser: ctx.parser ? 'sugarss' : false,
+  syntax: ctx.syntax ? 'sugarss' : false,
+  map: ctx.map ? 'inline' : false,
+  from: './test/ts/array/fixtures/index.css',
+  to: './test/ts/array/expect/index.css',
+  plugins: [
+    postcssImport(),
+    postcssNested({ preserveEmpty: true }),
+    ctx.env === 'production' ? cssnano() : false
+  ]
+});
+
+export default config;

test/ts/array/cts/postcss.config.cts

@@ -0,0 +1,16 @@
+import { ConfigFn } from '../../../src';
+
+const config: ConfigFn = ctx => ({
+  parser: ctx.parser ? 'sugarss' : false,
+  syntax: ctx.syntax ? 'sugarss' : false,
+  map: ctx.map ? 'inline' : false,
+  from: './test/ts/object/fixtures/index.css',
+  to: './test/ts/object/expect/index.css',
+  plugins: {
+    'postcss-import': {},
+    'postcss-nested': {},
+    cssnano: ctx.env === 'production' ? {} : false
+  }
+})
+
+export = config;