babel-plugin-transform-jsx-stylesheet - npm Package Compare versions

Comparing version 0.2.3 to 0.2.4

lib/index.js

@@ -99,8 +99,9 @@ 'use strict';
         var sourceValue = node.source.value;
-        var cssIndex = sourceValue.indexOf('.css');
+        var extname = _path2.default.extname(sourceValue);
+        var cssIndex = cssSuffixs.indexOf(extname);
         // Do not convert `import styles from './foo.css'` kind
-        if (node.importKind !== 'value' && cssIndex > 0) {
+        if (node.importKind !== 'value' && cssIndex > -1) {
           var cssFileCount = file.get('cssFileCount') || 0;
           var cssParamIdentifiers = file.get('cssParamIdentifiers') || [];
-          var cssFileBaseName = (0, _camelcase2.default)(_path2.default.basename(sourceValue, '.css'));
+          var cssFileBaseName = (0, _camelcase2.default)(_path2.default.basename(sourceValue, extname));
           var styleSheetIdentifier = t.identifier('' + (cssFileBaseName + NAME_SUFFIX));
@@ -154,4 +155,5 @@
 var NAME_SUFFIX = 'StyleSheet';
+var cssSuffixs = ['.css', '.scss', '.sass', '.less'];
 
 ;
 module.exports = exports['default'];

package.json

 {
   "name": "babel-plugin-transform-jsx-stylesheet",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "Transform stylesheet selector to style in JSX Elements.",
@@ -5,0 +5,0 @@ "license": "BSD-3-Clause",

src/__tests__/index.js

@@ -130,2 +130,23 @@ import jSXStylePlugin from '../index';
   });
+
+  it('transform scss file', () => {
+    expect(getTransfromCode(`
+import { createElement, Component } from 'rax';
+import './app.scss';
+
+class App extends Component {
+  render() {
+    return <div className="header" />;
+  }
+}`)).toBe(`
+import { createElement, Component } from 'rax';
+import appStyleSheet from './app.scss';
+
+class App extends Component {
+  render() {
+    return <div style={_styleSheet["header"]} />;
+  }
+}
+const _styleSheet = appStyleSheet;`);
+  });
 });

src/index.js

@@ -6,2 +6,3 @@ import path from 'path';
 const NAME_SUFFIX = 'StyleSheet';
+const cssSuffixs = ['.css', '.scss', '.sass', '.less'];
 
@@ -101,8 +102,9 @@ export default function({ types: t, template }) {
         const sourceValue = node.source.value;
-        const cssIndex = sourceValue.indexOf('.css');
+        const extname = path.extname(sourceValue);
+        const cssIndex = cssSuffixs.indexOf(extname);
         // Do not convert `import styles from './foo.css'` kind
-        if (node.importKind !== 'value' && cssIndex > 0) {
+        if (node.importKind !== 'value' && cssIndex > -1) {
           let cssFileCount = file.get('cssFileCount') || 0;
           let cssParamIdentifiers = file.get('cssParamIdentifiers') || [];
-          const cssFileBaseName = camelcase(path.basename(sourceValue, '.css'));
+          const cssFileBaseName = camelcase(path.basename(sourceValue, extname));
           const styleSheetIdentifier = t.identifier(`${cssFileBaseName + NAME_SUFFIX}`);
@@ -109,0 +111,0 @@

No alert changes

Improved metrics

Total package byte prevSize

16937

increased by4.25%

Lines of code

370

increased by6.32%

No dependency changes