vue项目启动时无法识别es6的扩展语法的解决

更新时间：2024年10月16日 09:22:25 作者：Juliet_xmj

启动项目时遇到ES6的拓展运算符报错可以通过切换到淘宝镜像,以及在项目根目录下新增.babelrc和postcss.config.js文件来解决,这些操作有助于正确配置项目环境,从而避免报错,并保证项目的顺利运行,希望这些经验能够帮助到遇到相同问题的开发者

vue项目启动时无法识别es6的扩展语法

启动项目报错

解决

ES6的拓展运算符报错

1.切换淘宝镜像

npm install -g cnpm --registry=http://registry.npm.taobao.org
cnpm install --legacy-peer-deps --save-dev babel-preset-stage-3
cnpm install --legacy-peer-deps --save-dev babel-plugin-transform-object-rest-spread

{
    "presets": [
        ["es2015", { "modules": false }]
    ],
    "plugins": ["transform-object-rest-spread"] //不能解析es6语法关键解决
}

3.根目录下新增文件postcss.config.js

module.exports = { 
    plugins: { 
        'autoprefixer': {browsers: 'last 5 version'} 
    } 
}

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

带你一文了解Vue生命周期钩子
生命周期钩子又被叫做生命周期时间,生命周期函数,生命周期钩子就是vue生命周期中出发的各类事件,这些事件被称为生命周期钩子,下面这篇文章主要给大家介绍了关于Vue生命周期钩子的相关资料,需要的朋友可以参考下
2022-06-06
vue中scss语法的使用你了解吗
这篇文章主要为大家详细介绍了vue中scss语法的使用，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助
2022-03-03
Vue父子组建的简单通信之控制开关Switch的实现
这篇文章主要介绍了Vue父子组建的简单通信之控制开关Switch的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2018-06-06
用Vue.js在浏览器中实现裁剪图像功能
在本教程中，我们将探讨如何在浏览器中使用 JavaScript 库来操作图片，为服务器上的存储做准备，并在 Web 程序中使用。我们将使用 Vue.js 而不是原生 JavaScript来完成此操作,需要的朋友可以参考下
2019-06-06
windows下vue-cli及webpack搭建安装环境
这篇文章主要介绍了windows下vue-cli及webpack搭建安装环境，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-04-04
vue3项目如何使用样式穿透修改elementUI默认样式
这篇文章主要介绍了vue3项目使用样式穿透修改elementUI默认样式,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2023-03-03
vue 查看dist文件里的结构(多种方式)
本文通过三种方式给大家介绍了vue 查看dist文件里的结构,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
2020-01-01
解决vue项目跳转同样的页面不刷新的问题思路详解
做公司官网项目的时候遇到的场景,顶部导航栏分类商品跳转到分类详情,然后在分类详情再次点击顶部导航栏里另外的分类商品,跳到同样的页面数据不刷新,下面小编给大家分享解决方式,关于vue跳转不刷新问题感兴趣的朋友一起看看吧
2023-09-09
不同场景下Vue中虚拟列表实现
虚拟列表用来解决大数据量数据渲染问题,由于一次性渲染性能低,所以诞生了虚拟列表渲染,下面我们就来学习一下不同场景下Vue中虚拟列表是如何实现的吧
2023-10-10
vue Echarts实现仪表盘案例
这篇文章主要为大家详细介绍了vue Echarts实现仪表盘案例，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-03-03