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代码 二.需要 ...
随机推荐
- HDOJ 1196 Lowest Bit
题目大意是给一个1-100的整数,要求首先转化成2进制,然后从最低位开始数起到不是0的位停止,输出这些位代表队额10进制数 #include <iostream> using namesp ...
- android sdk更新源
什么是Android SDK: SDK:(software development kit)软件开发工具包.被软件开发工程师用于为特定的软件包.软件框架.硬件平台.操作系统等建立应用软件的开发工具的集 ...
- oracle 监听服务OracleOraDb11g_home1TNSListener打开后立马停止错误
首先我真得吐槽一下,我安装这个破软件感觉真的是把能遇到的错误都遇到一遍了,生气!!!!!!! 关于监听服务OracleOraDb11g_home1TNSListener打开后立马停止这个错误,我的解决 ...
- Luogu 1357 花园
发现$m$很小,直接状压起来,可以处理出一开始的合法的状态. 对于每一个合法的状态,可以处理出它的转移方向,即在后面填一个$1$或者填一个$0$,反着处理比较方便. 考虑一下环的情况,在这题中有一个小 ...
- Luogu 1979 [NOIP2013] 华容道
要优先安排历年NOIP题 考虑到要移动,肯定要先把空的格子移动到起点旁边,所以我们对于每一个询问都先bfs一次求出把空格移到起点的四个位置的最短路,而且要保证不能移动起点的方块. 只有空的格子在一个格 ...
- c++中怎么实现Java中finally语句
所有学习c++的书籍都明确提出了,不要使用goto, 以免造成程序流程的混乱,使理解和调试程序都产生困难. 但是我们遇到这样一个场景怎么办:就是不管程序执行成功与否,都要执行一些资源释放语句,相当ja ...
- LeetCode第111题:二叉树的最小深度
问题描述 给定一个二叉树,找出其最小深度. 最小深度是从根节点到最近叶子节点的最短路径上的节点数量. 说明: 叶子节点是指没有子节点的节点. 示例: 给定二叉树 [3,9,20,null,null,1 ...
- 免费证书申请——Let's Encrypt的申请与应用(IIS,Tomcat)
环境 Windows Server 2008 R2 Tomcat 8.5.31 JDK8 利用IIS+letsencrypt-win-simple.V1.9.1申请免费SSL证书 新建一个IIS空网站 ...
- CentOS6.5上Zabbix3.0的RPM安装【二】-汉化
六.汉化 zabbix实际是有中文语言的,我们可以通过修改web端源文件来开启中文语言.首先点击zabbix监控页面右上角管理员头像进入“用户基本资料设置页面“. 选择中文语言. 点击“Update” ...
- JS图片转Base64
网络上有很多片介绍通过js将图片转换成base64的文章,之所以再写这篇文章的原因时发现没有找到系统的介绍的文章,有的介绍如何实现本地项目的图片转码,有的介绍如何实现网络资源的图片转化,但是系统介绍的 ...