diff --git a/packages/vue-cli-plugin-uni/packages/webpack-uni-app-loader/view/util.js b/packages/vue-cli-plugin-uni/packages/webpack-uni-app-loader/view/util.js index ff5340bfe883620416b6b95ce0caeb8736612d46..e30347e92804acb648296a052233b9a41ae3c78a 100644 --- a/packages/vue-cli-plugin-uni/packages/webpack-uni-app-loader/view/util.js +++ b/packages/vue-cli-plugin-uni/packages/webpack-uni-app-loader/view/util.js @@ -19,7 +19,8 @@ function parseComponents (content, traverse) { components: [], options: { name: null, - inheritAttrs: null + inheritAttrs: null, + props: null } }) return { @@ -30,4 +31,4 @@ function parseComponents (content, traverse) { module.exports = { parseComponents -} +} diff --git a/packages/webpack-uni-mp-loader/__tests__/components.spec.js b/packages/webpack-uni-mp-loader/__tests__/components.spec.js index e4e1a7132c358b74951b4f58f2fadf39098f2876..cbe2109b90a02f1cbc40f7f87176009c56b76db9 100644 --- a/packages/webpack-uni-mp-loader/__tests__/components.spec.js +++ b/packages/webpack-uni-mp-loader/__tests__/components.spec.js @@ -22,6 +22,28 @@ function assertCodegen (content, expectedComponents, isScoped = true) { expect(JSON.stringify(components)).toBe(JSON.stringify(expectedComponents)) } +function assertCodegenOptions (content, expectedOptions, isScoped = true) { + const { + state: { + options + } + } = (isScoped ? scopedComponentTraverse : globalComponentTraverse)(parser.parse(content, { + sourceType: 'module', + plugins: [ + 'typescript' + ] + }), { + components: [], + options: { + name: null, + inheritAttrs: null, + props: null + } + }) + + expect(JSON.stringify(options)).toBe(JSON.stringify(expectedOptions)) +} + describe('mp:loader', () => { it('parse scoped component', () => { assertCodegen( @@ -153,6 +175,46 @@ global['__wxVueOptions'] = { source: '@/components/my-button/my-button.vue' } ]) + + assertCodegenOptions( + `export default { + name: 'test' + }`, + { + name: '"test"', + inheritAttrs: null, + props: null + } + ) + + assertCodegenOptions( + `export default { + props: ['id', 'test'] + }`, + { + name: null, + inheritAttrs: null, + props: '["id","test"]' + } + ) + + assertCodegenOptions( + `export default { + props: { + id: { + type: String + }, + 'test': { + type: String + } + } + }`, + { + name: null, + inheritAttrs: null, + props: '["id","test"]' + } + ) }) it('parse global component', () => { diff --git a/packages/webpack-uni-mp-loader/lib/babel/scoped-component-traverse.js b/packages/webpack-uni-mp-loader/lib/babel/scoped-component-traverse.js index 42e320568a4f5e96d6ee3fcd0784b9f868c7535d..b6ee2b10ad6fd2e71eeae5e4e66e965f1d1dd627 100644 --- a/packages/webpack-uni-mp-loader/lib/babel/scoped-component-traverse.js +++ b/packages/webpack-uni-mp-loader/lib/babel/scoped-component-traverse.js @@ -6,7 +6,7 @@ const { } = require('./util') function handleObjectExpression (declaration, path, state) { - if (state.options) { // name,inheritAttrs + if (state.options) { // name,inheritAttrs,props Object.keys(state.options).forEach(name => { const optionProperty = declaration.properties.filter(prop => { return t.isObjectProperty(prop) && @@ -14,7 +14,21 @@ function handleObjectExpression (declaration, path, state) { prop.key.name === name })[0] if (optionProperty) { - if (t.isStringLiteral(optionProperty.value)) { + if (name === 'props') { + if (t.isArrayExpression(optionProperty.value)) { + state.options[name] = JSON.stringify(optionProperty.value.elements.filter(element => t.isStringLiteral(element)).map(({ value }) => value)) + } else if (t.isObjectExpression(optionProperty.value)) { + const props = [] + optionProperty.value.properties.forEach(({ key }) => { + if (t.isIdentifier(key)) { + props.push(key.name) + } else if (t.isStringLiteral(key)) { + props.push(key.value) + } + }) + state.options[name] = JSON.stringify(props) + } + } else if (t.isStringLiteral(optionProperty.value)) { state.options[name] = JSON.stringify(optionProperty.value.value) } else { state.options[name] = optionProperty.value.value