diff --git a/src/utils/detectors.js b/src/utils/detectors.js index 94d4101e..65c5bf39 100644 --- a/src/utils/detectors.js +++ b/src/utils/detectors.js @@ -1,16 +1,19 @@ -import { useTopLevelImportPaths } from './options' +import escapeRegExp from 'lodash/escapeRegExp' +import { useTopLevelImportPathMatchers } from './options' -const VALID_TOP_LEVEL_IMPORT_PATHS = [ +const VALID_TOP_LEVEL_IMPORT_PATH_MATCHERS = [ 'styled-components', 'styled-components/no-tags', 'styled-components/native', 'styled-components/primitives', -] +].map(literal => new RegExp(`^${escapeRegExp(literal)}$`)) -export const isValidTopLevelImport = (x, state) => - [...VALID_TOP_LEVEL_IMPORT_PATHS, ...useTopLevelImportPaths(state)].includes( - x - ) +export const isValidTopLevelImport = (x, state) => { + return [ + ...VALID_TOP_LEVEL_IMPORT_PATH_MATCHERS, + ...useTopLevelImportPathMatchers(state), + ].some(re => re.test(x)); +} const localNameCache = {} diff --git a/src/utils/options.js b/src/utils/options.js index 1b529176..e653545d 100644 --- a/src/utils/options.js +++ b/src/utils/options.js @@ -5,8 +5,8 @@ function getOption({ opts }, name, defaultValue = true) { } export const useDisplayName = state => getOption(state, 'displayName') -export const useTopLevelImportPaths = state => - getOption(state, 'topLevelImportPaths', []) +export const useTopLevelImportPathMatchers = state => + getOption(state, 'topLevelImportPaths', []).map(pattern => new RegExp(pattern)) export const useSSR = state => getOption(state, 'ssr', true) export const useFileName = state => getOption(state, 'fileName') export const useMinify = state => getOption(state, 'minify') diff --git a/src/visitors/minify.js b/src/visitors/minify.js index d3b52358..b0140b60 100644 --- a/src/visitors/minify.js +++ b/src/visitors/minify.js @@ -14,10 +14,8 @@ export default t => (path, state) => { templateLiteral.quasis.map(x => x.value.raw) ) - const [ - cookedValuesMinfified, - eliminatedExpressionIndices, - ] = minifyCookedValues(templateLiteral.quasis.map(x => x.value.cooked)) + const [cookedValuesMinfified, eliminatedExpressionIndices] = + minifyCookedValues(templateLiteral.quasis.map(x => x.value.cooked)) eliminatedExpressionIndices.forEach((expressionIndex, iteration) => { templateLiteral.expressions.splice(expressionIndex - iteration, 1) diff --git a/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/.babelrc b/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/.babelrc index 63576b5f..4d65988c 100644 --- a/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/.babelrc +++ b/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/.babelrc @@ -6,7 +6,7 @@ "displayName": true, "fileName": false, "ssr": true, - "topLevelImportPaths": ["@example/example"], + "topLevelImportPaths": [".*\/example$"], "transpileTemplateLiterals": false } ] diff --git a/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/code.js b/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/code.js index e26d3c7c..cc95461a 100644 --- a/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/code.js +++ b/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/code.js @@ -1,4 +1,4 @@ -import { styled } from '@example/example' +import { styled } from '../../relative/example' const Test = styled.div` width: 100%; diff --git a/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/output.js b/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/output.js index 968d01b6..6b98714b 100644 --- a/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/output.js +++ b/test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/output.js @@ -1,4 +1,4 @@ -import { styled } from '@example/example'; +import { styled } from '../../relative/example'; const Test = styled.div.withConfig({ displayName: "Test", componentId: "sc-elhbfv-0" diff --git a/test/fixtures/add-identifier-with-top-level-import-paths/.babelrc b/test/fixtures/add-identifier-with-top-level-import-paths/.babelrc index ef8b91b2..9a4e75d9 100644 --- a/test/fixtures/add-identifier-with-top-level-import-paths/.babelrc +++ b/test/fixtures/add-identifier-with-top-level-import-paths/.babelrc @@ -8,9 +8,7 @@ "ssr": true, "topLevelImportPaths": [ "@xstyled/styled-components", - "@xstyled/styled-components/no-tags", - "@xstyled/styled-components/native", - "@xstyled/styled-components/primitives" + "@xstyled/styled-components/*" ], "transpileTemplateLiterals": false } diff --git a/test/fixtures/add-identifier-with-top-level-import-paths/code.js b/test/fixtures/add-identifier-with-top-level-import-paths/code.js index b03b6c13..905b6d7e 100644 --- a/test/fixtures/add-identifier-with-top-level-import-paths/code.js +++ b/test/fixtures/add-identifier-with-top-level-import-paths/code.js @@ -1,4 +1,4 @@ -import styled from '@xstyled/styled-components' +import styled from '@xstyled/styled-components/test' const Test = styled.div` width: 100%; diff --git a/test/fixtures/add-identifier-with-top-level-import-paths/output.js b/test/fixtures/add-identifier-with-top-level-import-paths/output.js index 7cdb5723..e6e909ca 100644 --- a/test/fixtures/add-identifier-with-top-level-import-paths/output.js +++ b/test/fixtures/add-identifier-with-top-level-import-paths/output.js @@ -1,4 +1,4 @@ -import styled from '@xstyled/styled-components'; +import styled from '@xstyled/styled-components/test'; const Test = styled.div.withConfig({ componentId: "sc-1mlyrvc-0" })`width:100%;`;