mirror of
https://github.com/vuejs/babel-plugin-jsx.git
synced 2025-02-11 16:00:22 +08:00
fix: isFragment get wrong result
feat: PatchFlag will be bail when has container chore: remove npmignore
This commit is contained in:
parent
65a1912809
commit
8a6c8a7ca2
@ -1,4 +0,0 @@
|
|||||||
example
|
|
||||||
index.html
|
|
||||||
webpack.config.js
|
|
||||||
test
|
|
@ -19,6 +19,9 @@
|
|||||||
"bugs": {
|
"bugs": {
|
||||||
"url": "https://github.com/vueComponent/jsx/issues"
|
"url": "https://github.com/vueComponent/jsx/issues"
|
||||||
},
|
},
|
||||||
|
"files": [
|
||||||
|
"dist"
|
||||||
|
],
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@ant-design-vue/babel-helper-vue-compatible-props": "^1.0.0",
|
"@ant-design-vue/babel-helper-vue-compatible-props": "^1.0.0",
|
||||||
"@ant-design-vue/babel-helper-vue-transform-on": "^1.0.0",
|
"@ant-design-vue/babel-helper-vue-transform-on": "^1.0.0",
|
||||||
|
@ -30,10 +30,10 @@ const transformJSXSpreadAttribute = (t, path, mergeArgs) => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const getJSXAttributeValue = (t, path) => {
|
const getJSXAttributeValue = (t, path, state) => {
|
||||||
const valuePath = path.get('value');
|
const valuePath = path.get('value');
|
||||||
if (valuePath.isJSXElement()) {
|
if (valuePath.isJSXElement()) {
|
||||||
return transformJSXElement(t, valuePath);
|
return transformJSXElement(t, valuePath, state);
|
||||||
}
|
}
|
||||||
if (valuePath.isStringLiteral()) {
|
if (valuePath.isStringLiteral()) {
|
||||||
return valuePath.node;
|
return valuePath.node;
|
||||||
@ -97,7 +97,7 @@ const dedupeProperties = (t, properties = []) => {
|
|||||||
return deduped;
|
return deduped;
|
||||||
};
|
};
|
||||||
|
|
||||||
const buildProps = (t, path, state) => {
|
const buildProps = (t, path, state, hasContainer) => {
|
||||||
const tag = getTag(t, path);
|
const tag = getTag(t, path);
|
||||||
const isComponent = checkIsComponent(t, path.get('openingElement'));
|
const isComponent = checkIsComponent(t, path.get('openingElement'));
|
||||||
const props = path.get('openingElement').get('attributes');
|
const props = path.get('openingElement').get('attributes');
|
||||||
@ -108,6 +108,8 @@ const buildProps = (t, path, state) => {
|
|||||||
|
|
||||||
if (isFragment(t, path.get('openingElement.name'))) {
|
if (isFragment(t, path.get('openingElement.name'))) {
|
||||||
patchFlag |= PatchFlags.STABLE_FRAGMENT;
|
patchFlag |= PatchFlags.STABLE_FRAGMENT;
|
||||||
|
} else if (hasContainer) {
|
||||||
|
patchFlag |= PatchFlags.BAIL;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (props.length === 0) {
|
if (props.length === 0) {
|
||||||
@ -316,12 +318,16 @@ const buildProps = (t, path, state) => {
|
|||||||
* @param paths Array<JSXText | JSXExpressionContainer | JSXSpreadChild | JSXElement>
|
* @param paths Array<JSXText | JSXExpressionContainer | JSXSpreadChild | JSXElement>
|
||||||
* @returns Array<Expression | SpreadElement>
|
* @returns Array<Expression | SpreadElement>
|
||||||
*/
|
*/
|
||||||
const getChildren = (t, paths) => paths
|
const getChildren = (t, paths, state) => {
|
||||||
|
let hasContainer = false;
|
||||||
|
return {
|
||||||
|
children: paths
|
||||||
.map((path) => {
|
.map((path) => {
|
||||||
if (path.isJSXText()) {
|
if (path.isJSXText()) {
|
||||||
return transformJSXText(t, path);
|
return transformJSXText(t, path);
|
||||||
}
|
}
|
||||||
if (path.isJSXExpressionContainer()) {
|
if (path.isJSXExpressionContainer()) {
|
||||||
|
hasContainer = true;
|
||||||
return transformJSXExpressionContainer(path);
|
return transformJSXExpressionContainer(path);
|
||||||
}
|
}
|
||||||
if (path.isJSXSpreadChild()) {
|
if (path.isJSXSpreadChild()) {
|
||||||
@ -331,25 +337,27 @@ const getChildren = (t, paths) => paths
|
|||||||
return path.node;
|
return path.node;
|
||||||
}
|
}
|
||||||
if (path.isJSXElement()) {
|
if (path.isJSXElement()) {
|
||||||
return transformJSXElement(t, path);
|
return transformJSXElement(t, path, state);
|
||||||
}
|
}
|
||||||
throw new Error(`getChildren: ${path.type} is not supported`);
|
throw new Error(`getChildren: ${path.type} is not supported`);
|
||||||
}).filter((value) => (
|
}).filter((value) => (
|
||||||
value !== undefined
|
value !== undefined
|
||||||
&& value !== null
|
&& value !== null
|
||||||
&& !t.isJSXEmptyExpression(value)
|
&& !t.isJSXEmptyExpression(value)
|
||||||
));
|
)),
|
||||||
|
hasContainer,
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
const transformJSXElement = (t, path, state) => {
|
const transformJSXElement = (t, path, state) => {
|
||||||
const children = t.arrayExpression(getChildren(t, path.get('children')));
|
const { children, hasContainer } = getChildren(t, path.get('children'), state);
|
||||||
const {
|
const {
|
||||||
tag,
|
tag,
|
||||||
props,
|
props,
|
||||||
directives,
|
directives,
|
||||||
patchFlag,
|
patchFlag,
|
||||||
dynamicPropNames,
|
dynamicPropNames,
|
||||||
} = buildProps(t, path, state);
|
} = buildProps(t, path, state, hasContainer);
|
||||||
|
|
||||||
const flagNames = Object.keys(PatchFlagNames)
|
const flagNames = Object.keys(PatchFlagNames)
|
||||||
.map(Number)
|
.map(Number)
|
||||||
@ -358,8 +366,8 @@ const transformJSXElement = (t, path, state) => {
|
|||||||
.join(', ');
|
.join(', ');
|
||||||
|
|
||||||
const isComponent = checkIsComponent(t, path.get('openingElement'));
|
const isComponent = checkIsComponent(t, path.get('openingElement'));
|
||||||
const child = children.elements.length === 1 && t.isStringLiteral(children.elements[0])
|
const child = children.length === 1 && t.isStringLiteral(children[0])
|
||||||
? children.elements[0] : children;
|
? children[0] : t.arrayExpression(children);
|
||||||
if (state.opts.compatibleProps && !state.get('compatibleProps')) {
|
if (state.opts.compatibleProps && !state.get('compatibleProps')) {
|
||||||
state.set('compatibleProps', addDefault(
|
state.set('compatibleProps', addDefault(
|
||||||
path, '@ant-design-vue/babel-helper-vue-compatible-props', { nameHint: '_compatibleProps' },
|
path, '@ant-design-vue/babel-helper-vue-compatible-props', { nameHint: '_compatibleProps' },
|
||||||
@ -369,7 +377,7 @@ const transformJSXElement = (t, path, state) => {
|
|||||||
const createVNode = t.callExpression(createIdentifier(t, state, 'createVNode'), [
|
const createVNode = t.callExpression(createIdentifier(t, state, 'createVNode'), [
|
||||||
tag,
|
tag,
|
||||||
state.opts.compatibleProps ? t.callExpression(state.get('compatibleProps'), [props]) : props,
|
state.opts.compatibleProps ? t.callExpression(state.get('compatibleProps'), [props]) : props,
|
||||||
children.elements[0]
|
children[0]
|
||||||
? (
|
? (
|
||||||
isComponent
|
isComponent
|
||||||
? t.objectExpression([
|
? t.objectExpression([
|
||||||
|
@ -50,7 +50,7 @@ const isDirective = (src) => src.startsWith('v-')
|
|||||||
* @returns boolean
|
* @returns boolean
|
||||||
*/
|
*/
|
||||||
const isFragment = (t, path) => t.isJSXMemberExpression(path)
|
const isFragment = (t, path) => t.isJSXMemberExpression(path)
|
||||||
&& path.node.property.name;
|
&& path.node.property.name === 'Fragment';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Check if a JSXOpeningElement is a component
|
* Check if a JSXOpeningElement is a component
|
||||||
@ -268,7 +268,7 @@ const parseDirectives = (t, {
|
|||||||
|
|
||||||
return {
|
return {
|
||||||
directiveName,
|
directiveName,
|
||||||
modifiers: new Set(modifiers),
|
modifiers: modifiersSet,
|
||||||
directive: hasDirective ? [
|
directive: hasDirective ? [
|
||||||
resolveDirective(t, path, state, tag, directiveName),
|
resolveDirective(t, path, state, tag, directiveName),
|
||||||
value,
|
value,
|
||||||
@ -285,7 +285,6 @@ const parseDirectives = (t, {
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
export {
|
export {
|
||||||
createIdentifier,
|
createIdentifier,
|
||||||
isDirective,
|
isDirective,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user