Nuxt 2.3.X 配置babel
1. 在package.json中修改运行脚本
添加--exec babel-node
添加之后的效果为:(修改了8/10行)
{
"name": "nuxt-learn",
"version": "1.0.0",
"description": "My lovely Nuxt.js project",
"author": "wqzhai",
"private": true,
"scripts": {
"dev": "cross-env NODE_ENV=development nodemon server/index.js --watch server --exec babel-node",
"build": "nuxt build",
"start": "cross-env NODE_ENV=production node server/index.js --exec babel-node",
"generate": "nuxt generate"
},
"dependencies": {
"@nuxtjs/axios": "^5.0.0",
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-preset-es2015": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"cross-env": "^5.2.0",
"element-ui": "^2.4.6",
"koa": "^2.5.2",
"nuxt": "^2.0.0"
},
"devDependencies": {
"nodemon": "^1.11.0"
}
}
2.安装编译工具
npm i babel-cli // 这是babel解释器的客户端主程序
npm i babel-core // babel的核心文件,好像默认会自动安装
npm i babel-preset-es2015 // 把代码转换成ES6
npm i babel-preset-stage-0 // 把代码转换成ES7
3.在根路径创建.babelrc文件,写入配置
.babelrc
{
"presets": ["es2015","stage-0"]
}
4.重新启动项目即可
Nuxt 2.3.X 配置babel的更多相关文章
- 配置babel
配置babel ECMAScript的版本,每年都会定期举行会议,发布各种标准,当前版本到了2019,但大部分人使用的浏览器,都可以支持es2015,也就是es6,要等到大部分浏览器都支持到最新版本, ...
- 【02】webstorm配置babel转换器+截图(by魔芋)
[02]webstorm配置babel转换器+截图(by魔芋) [02]魔芋的安装过程 01,配置babel. 02,用webstorm.注意webstorm的版本号. 03,使用 ...
- webpack.config.js====配置babel
参考:https://www.jianshu.com/p/9808f550c6a91. 安装依赖babel-loader: 负责 es6 语法转化babel-preset-env: 包含 es6.7 ...
- [转] webpack中配置Babel
一.安装 npm install --save-dev babel-loader babel-core babel-preset-env 二.在webpack.config.js中配置module 1 ...
- babel-plugin-import配置babel按需引入antd模块,编译后报错.bezierEasingMixin()
用create-react-app做项目的时候,同时引入了antd,为了实现按需加载antd模块,用到他们提供的 babel-plugin-import ( 一个用于按需加载组件代码和样式的 ba ...
- webpack中配置Babel
Babel是一个javascript编译器,可以将ES6和更新的js语法转换成ES5的,使代码在较老的浏览器里也能正常运行. 一.安装 npm install --save-dev babel-loa ...
- webstorm配置babel自动转译es6的方法
1.npm安装babel npm install -g babel-cli 2.npm安装Babel的preset npm install --save-dev babel-preset-es2015 ...
- nuxt.config有关router配置
这里只说明一个属性,其他属性移步官方文档 https://zh.nuxtjs.org/api/configuration-router extendRoutes 官方说明: 你可以通过 exten ...
- 基于webpack实现多html页面开发框架五 开发环境配置 babel配置
一.解决什么问题 1.开发环境js.css不压缩,可在浏览器选中代码调试 2.开发环境运行http服务指向打包后的文件夹 3.babel输出浏览器兼容的js代码 二.需要 ...
随机推荐
- MVC要点
1.绑定一个DropDownList @Html.DropDownListFor(m => m.MobileType, new List<SelectListItem>() { ne ...
- 源码方式安装rabbitmq
由于工作环境中属于内网,yum安装方式不可用,所以需要采用源码进行rabbitmq的安装.rabbitmq是基于erlang环境进行运行的,所以需要先按照erlang环境,才能运行rabbitmq-s ...
- C 语言 clock() 函数,例:计算多项式值
C 语言 clock() 函数,例:计算多项式值 /** * clock(): 捕捉从程序开始运行到 clock() 被调用时所耗费的时间. * 这个时间单位是 clock tick, 即" ...
- KDevelop4调试pcl一直读取不到.pcd文件
如题所示,KD下,能编译,运行时一直使用reader.read读取不到pcd,但是使用cmake能正常运行. 后来,使用terminator删掉工程的build文件夹,直接在工程文件下进行编译,报错提 ...
- java基础之流程控制语句
一. 分支 1. 三元运算符 ?: 注意:三元运算符虽然简洁但是语法乱,而且必须要有接受者或者直接打印 1. if else语句 另一种不带括号的写法: if(条件) 语句1 ...
- 【Linux】-Ubuntu下配置JDK1.8
前言 这次实在是不想写前言了,好吧,那咱就不写了. 内容 怀着复杂的心情来整理这个小小的操作,其实我的内心是拒绝的,因为太简单了,但是我却花费了很长的时间,有效时间花费了将近两个小时去整理这个小玩意儿 ...
- 转载Json和Xml的区别,以及它们的底层是如何处理的
XML:可扩展标记语言 JSON:轻量级的数据交换格式 区别: 1.可读性方面:基本相同,Xml的可读性较好些: 2.可扩展性方面:都有较好的扩展性: 3.编码难度方面:json的编码较容 ...
- 洛谷 P4297 [NOI2006]网络收费
P4297 [NOI2006]网络收费 题目背景 noi2006 day1t1 题目描述 网络已经成为当今世界不可或缺的一部分.每天都有数以亿计的人使用网络进行学习.科研.娱乐等活动.然而,不可忽视的 ...
- Python之‘数据结构’
简介 数据结构基本上就是--它们是可以处理一些数据的结构.或者说,它们是用来存储一组相关数据的.在Python里面有三种内建的数据结构--列表.元组和字典. 一.列表 list是处理一组有序项目的数据 ...
- 析构函数-复制构造函数-赋值操作符重载-默认构造函数<代码解析>
通过下面primer中的一道习题,可以更深刻的了解,析构函数,复制构造函数,赋值操作符重载,默认构造函数的使用. 但是我的结果与primer习题解答里面的并不相同,可能是编译器不同的原因导致. // ...