小孩才做选择题,大人说我全要。
ant motion 的动效很不错,但自己的项目是基于vue-cli的,换react明显不现实。
需求就是这样出现。
废话不多说,解决方案就在这了。
涉及修改2个文件babel.config.js
和vue.config.js
-
babel.config.js
文件中presets 的@vue/app,
替换为
参考文档[ '@vue/app', { jsx: false, } ],
https://cli.vuejs.org/zh/config/#babel
https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/babel-preset-app
-
vue.config.js
中增使用自制的jsx文件解析配置configureWebpack(){ return { module: { rules: [ { test: /\.jsx$/, use: [ { loader: 'babel-loader', options: { presets: [ [ "@babel/preset-react", { pragma:"React.createElement", } ] ], plugins: [ [`@babel/plugin-proposal-decorators`, { legacy: true }] ] } } ], include: path.resolve(__dirname, 'src'), exclude: path.resolve(__dirname, "node_modules/"), } ] } } }
安装依赖
yarn add -D @babel/preset-react react react-dom
-
https://github.com/akxcv/vuera
此外还可以通过第三方的库来实现,具体没使用过,自行研究