一、成功运行后vue版本

 

 

 二、创建中遇到的问题

        1、开始创建项目时,vue、ant、webpack(8.15.0)都是高版本,ant 1.7.8版本的代码不能适用(需求为:学习ant 1.7.8版本)。

               页面中一些内容不能正常显示

                开始修改版本,vue改成^2.6.11,ant改成^1.5.1,没有对@vue/cli的版本进行修改。发现页面还是不能显示,代码出现错误。

                 查看报错信息之后发现为webpack版本过高

       2、同时按照ant使用指引,使用 babel-plugin-import 进行按需导入(对于这一步,不确定是否真实需要,在mian.js中依旧是加载全部组件)。出现问题,找不到antd。

三、解决问题

       1、对于webpack版本高出现的问题,解决办法:

1-1、安装node-polyfill-webpack-plugin

  npm install node-polyfill-webpack-plugin 

1-2、vue.config.js中修改配置

        runtimeCompiler:true 解决main.js文件中使用了template:'<App/>’的报错问题

        手动引入polyfill模块,解决webpack5中移除了nodejs核心模块的polyfill自动引入的问题

 const NodePolyfillPlugin = require(‘node-polyfill-webpack-plugin’)

 configureWebpack:{ plugins:[new NodePolyfillPlugin()] } 

2、使用 babel-plugin-import 进行按需导入之后,又要全局导入,找不到antd的解决办法。

      从babel.config.js文件中移除  plugins: [[‘import’, { libraryName: ‘ant-design-vue’, libraryDirectory: ‘es’, style: ‘css’ }]]  配置信息

问题解决!!!

原文地址:http://www.cnblogs.com/shlbetter/p/16832734.html

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长! 2. 分享目的仅供大家学习和交流,请务用于商业用途! 3. 如果你也有好源码或者教程,可以到用户中心发布,分享有积分奖励和额外收入! 4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解! 5. 如有链接无法下载、失效或广告,请联系管理员处理! 6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需! 7. 如遇到加密压缩包,默认解压密码为"gltf",如遇到无法解压的请联系管理员! 8. 因为资源和程序源码均为可复制品,所以不支持任何理由的退款兑现,请斟酌后支付下载 声明:如果标题没有注明"已测试"或者"测试可用"等字样的资源源码均未经过站长测试.特别注意没有标注的源码不保证任何可用性