diff --git a/.changeset/olive-seas-promise.md b/.changeset/olive-seas-promise.md new file mode 100644 index 000000000..27b009aa3 --- /dev/null +++ b/.changeset/olive-seas-promise.md @@ -0,0 +1,6 @@ +--- +'babel-plugin-extend-docs': patch +'rocket-preset-extend-lion-docs': patch +--- + +Support usage of import assertions like `import style from 'my-pkg/style' assert { type: 'css' };` diff --git a/packages-node/babel-plugin-extend-docs/src/handleImports.js b/packages-node/babel-plugin-extend-docs/src/handleImports.js index 8dc8257e3..a3d4fedd4 100644 --- a/packages-node/babel-plugin-extend-docs/src/handleImports.js +++ b/packages-node/babel-plugin-extend-docs/src/handleImports.js @@ -9,6 +9,7 @@ function getImportAs(specifier, newImportName) { function renameAndStoreImports({ path, state, opts, types: t }) { for (const specifier of path.node.specifiers) { + const { assertions } = path.node; let managed = false; if (t.isIdentifier(specifier.imported) && specifier.type === 'ImportSpecifier') { @@ -26,6 +27,7 @@ function renameAndStoreImports({ path, state, opts, types: t }) { state.importedStorage.push({ action: 'change', specifier, + assertions, path: to, }); managed = true; @@ -39,6 +41,7 @@ function renameAndStoreImports({ path, state, opts, types: t }) { state.importedStorage.push({ action: 'keep', specifier, + assertions, path: path.node.source.value, }); } @@ -50,15 +53,18 @@ function generateImportStatements({ state, types: t }) { const statements = {}; for (const imp of state.importedStorage) { if (!statements[imp.path]) { - statements[imp.path] = []; + statements[imp.path] = { specifier: [] }; } - statements[imp.path].push(imp.specifier); + statements[imp.path].specifier.push(imp.specifier); + statements[imp.path].assertions = imp.assertions; } const res = []; for (const path of Object.keys(statements)) { - const importSpecifiers = statements[path]; + const { specifier, assertions } = statements[path]; const source = t.stringLiteral(path); - res.push(t.importDeclaration(importSpecifiers, source)); + const dec = t.importDeclaration(specifier, source); + dec.assertions = assertions; + res.push(dec); } return res; } diff --git a/packages-node/babel-plugin-extend-docs/test-node/babelPluginExtendDocs.test.js b/packages-node/babel-plugin-extend-docs/test-node/babelPluginExtendDocs.test.js index 0a3a7704f..450adfed1 100644 --- a/packages-node/babel-plugin-extend-docs/test-node/babelPluginExtendDocs.test.js +++ b/packages-node/babel-plugin-extend-docs/test-node/babelPluginExtendDocs.test.js @@ -259,6 +259,12 @@ describe('babel-plugin-extend-docs', () => { expect(executeBabel(code, testConfig)).to.equal(output); }); + it('supports import assertions', () => { + const code = `import style from '@lion/input/style' assert { type: 'css' };`; + const output = `import style from "@lion/input/style" assert { type: 'css' };`; + expect(executeBabel(code, testConfig)).to.equal(output); + }); + // nice to have it.skip("doesn't care about namespace imports", () => { const code = `import * as all from '@lion/input';`; diff --git a/packages-node/babel-plugin-extend-docs/test-node/helpers.js b/packages-node/babel-plugin-extend-docs/test-node/helpers.js index 6324f5ef8..43e4e8f8d 100644 --- a/packages-node/babel-plugin-extend-docs/test-node/helpers.js +++ b/packages-node/babel-plugin-extend-docs/test-node/helpers.js @@ -4,7 +4,7 @@ const babelPluginExtendDocs = require('../src/babelPluginExtendDocs.js'); function executeBabel(input, options) { const result = babel.transform(input, { - plugins: [[babelPluginExtendDocs, options]], + plugins: [[babelPluginExtendDocs, options], '@babel/plugin-syntax-import-assertions'], }); return result.code; } diff --git a/packages-node/rocket-preset-extend-lion-docs/package.json b/packages-node/rocket-preset-extend-lion-docs/package.json index 5a58bd64c..c62cda84d 100644 --- a/packages-node/rocket-preset-extend-lion-docs/package.json +++ b/packages-node/rocket-preset-extend-lion-docs/package.json @@ -28,6 +28,7 @@ }, "dependencies": { "@babel/core": "^7.10.1", + "@babel/plugin-syntax-import-assertions": "^7.14.5", "babel-plugin-extend-docs": "0.5.0", "es-module-lexer": "^0.3.6", "plugins-manager": "^0.2.1", diff --git a/packages-node/rocket-preset-extend-lion-docs/src/remarkExtendLionDocsTransformJs.js b/packages-node/rocket-preset-extend-lion-docs/src/remarkExtendLionDocsTransformJs.js index e24b431f5..36e4b80bb 100644 --- a/packages-node/rocket-preset-extend-lion-docs/src/remarkExtendLionDocsTransformJs.js +++ b/packages-node/rocket-preset-extend-lion-docs/src/remarkExtendLionDocsTransformJs.js @@ -62,7 +62,10 @@ export function remarkExtendLionDocsTransformJs({ extendDocsConfig }) { node.value ) { const processed = transformSync(node.value, { - plugins: [['babel-plugin-extend-docs', extendDocsConfig]], + plugins: [ + ['babel-plugin-extend-docs', extendDocsConfig], + '@babel/plugin-syntax-import-assertions', + ], }); if (processed && processed.code) { node.value = processed.code; diff --git a/packages-node/rocket-preset-extend-lion-docs/test-node/remarkExtendLionDocsTransformJs.test.js b/packages-node/rocket-preset-extend-lion-docs/test-node/remarkExtendLionDocsTransformJs.test.js index b94d3ca9e..e66d472a5 100644 --- a/packages-node/rocket-preset-extend-lion-docs/test-node/remarkExtendLionDocsTransformJs.test.js +++ b/packages-node/rocket-preset-extend-lion-docs/test-node/remarkExtendLionDocsTransformJs.test.js @@ -140,4 +140,24 @@ describe('remarkExtendLionDocsTransformJs', () => { expect(result.html).to.include('ing-accordion'); }); + + it('keeps import assertions in tact', async () => { + const result = await execute( + [ + '', + '```js script', + "import style from '@lion/core/style' assert { type: 'css' };", + "import { LionInput } from '@lion/core';", + '```', + '', + ].join('\n'), + ); + + expect(result.jsCode).to.equal( + [ + 'import style from "@lion/core/style" assert { type: \'css\' };', + 'import { LionInput } from "@lion/core";', + ].join('\n'), + ); + }); }); diff --git a/yarn.lock b/yarn.lock index 68910f951..b79cf6b3b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -248,6 +248,11 @@ resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.13.0.tgz#806526ce125aed03373bc416a828321e3a6a33af" integrity sha512-ZPafIPSwzUlAoWT8DKs1W2VyF2gOWthGd5NGFMsBcMMol+ZhK+EQY/e6V96poa6PA/Bh+C9plWN0hXO1uB8AfQ== +"@babel/helper-plugin-utils@^7.14.5": + version "7.14.5" + resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.14.5.tgz#5ac822ce97eec46741ab70a517971e443a70c5a9" + integrity sha512-/37qQCE3K0vvZKwoK4XU/irIJQdIfCJuhU5eKnNxpFDsOkgFaUAwbv+RYw6eYgsC0E4hS7r5KqGULUogqui0fQ== + "@babel/helper-remap-async-to-generator@^7.13.0": version "7.13.0" resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.13.0.tgz#376a760d9f7b4b2077a9dd05aa9c3927cadb2209" @@ -502,6 +507,13 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.3" +"@babel/plugin-syntax-import-assertions@^7.14.5": + version "7.14.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.14.5.tgz#86dc6102dddf05781b2c36350b695fcb89d7cce4" + integrity sha512-bCaGuphEinZeNtIUohltvmShQbiABsKVpg/tivRLJpAZUkHIJTtzTBjV/kOik1QZhS+G3QXVoajUlpOMOXO7vA== + dependencies: + "@babel/helper-plugin-utils" "^7.14.5" + "@babel/plugin-syntax-import-meta@^7.10.4", "@babel/plugin-syntax-import-meta@^7.2.0": version "7.10.4" resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.10.4.tgz#ee601348c370fa334d2207be158777496521fd51"