Fix react fragment

packages/babel-plugin-react-scoped-css/README.md

@@ -99,6 +99,16 @@ also note that you can define your own matching rule like this
 If you have other plugins installed, just add it to the list, order doesn't matter.
 
 Note: this plugin accepts `include`(RegExp, which defaults to `/\.scoped\.(sa|sc|c)ss$/`) to config which css file to be identified as scoped.
+Note: this plugin accepts `ignoreNode` to config which Node to be ignore. eg React.Fragment config 
+```js
+const ignoreNode = (node) => {
+    if(node.openingElement.name.name === 'Fragment') return true;
+    if(node.openingElement.name.type === 'JSXMemberExpression' 
+      && node.openingElement.name.object.name === 'React'
+      && node.openingElement.name.property.name === 'Fragment' )  return true;
+    return false;
+};
+``` 
 
 **the webpack loader**
 

packages/babel-plugin-react-scoped-css/index.js

@@ -49,9 +49,12 @@ module.exports = function ({ types: t }) {
         path.node.source.value = `${path.node.source.value}?scopeId=${hash}`;
       },
       JSXElement(path, stats) {
+        const { ignoreNode } = stats.opts;
+        // ignoreNode 可以让用户自定义哪些节点不添加约束，比如 React.Fragment 添加额外属性会报warn或error
         if (
           !this.hasScopedCss ||
-          path.node.openingElement.name.type === "JSXMemberExpression"
+          (typeof ignoreNode === 'function' ? ignoreNode(path.node, stats) : path.node.openingElement.name.type === "JSXMemberExpression")
+
         ) {
           return;
         }