最近在学用nuxt集成koa2做vue后台,发现官方自带脚手架搭建的koa2使用的仍是es5语法,如果想用es6怎么办呢?

这是由于自带脚手架在构建koa2时默认的nodemon是没有使用babel编译的,所以我们首先需要在启动命令后加上 --exec babel-node


"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",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint"

这还不够,因为我们没有去配置babel,所以我们需要在.babelrc去做一下presets的配置,在此之前我们需要安装一下babel插件

没有全局安装过babel-cli的同学请输入


npm i babel-cli -g

使用yarn的同学则输入


yarn global add babel-cli

保险起见你可能还需要安装babel-core


npm i babel-core -g

然后我们开始安装babel-preset,输入


npm i babel-preset-es2015 --save-dev

使用yarn的同学输入


yarn add babel-preset-es2015 -d

最后一步,我们需要在项目的根目录创建.babelrc文件,并在里面写上如下配置:


{
"presets": ["es2015"]
}

OK, 大功告成!开始愉快的用es6写koa2吧!

来源:https://segmentfault.com/a/1190000017327034

使用nuxt.js官方脚手架构建koa2的es6编译问题的更多相关文章

  1. 使用nuxt.js官方脚手架构建项目时ES6编译问题SyntaxError: Unexpected token import

    用nuxt集成koa2做vue后台,官方自带脚手架搭建的koa2仍是ES5语法,在构建koa2时默认的nodemon是没有使用babel编译的, 所以首先需要在启动命令后加上--exec babel- ...

  2. Vue.js项目脚手架构建

    vue.js文档:https://cn.vuejs.org/v2/guide/ 参考这个或者参考菜鸟教程也可以,不过还是那句话官网权威. 我这个主要是看相关的学习视频搭建的. 一.环境准备 环境准备( ...

  3. node.js应用脚手架:koa2、sequelize、mysql

    自制了一个 nodejs 应用的脚手架. 基于 koa2 的,所以需要保证 node 环境至少为 7.6.0 吸取了以前的踩坑教训,添加了守护进程,确保应用不会因为异常导致网站直接挂掉(使用了 for ...

  4. Nuxt.js项目实战

    感悟 经过几个周六周日的尝试,终于解决了服务端渲染中的常见问题,当SEO不在是问题的时候,或许才是我们搞前端的真正的春天,其中也遇到了一些小坑,Nuxt.js官方还是很给力的,提issue后很积极的给 ...

  5. Nuxt.js 基础入门教程

    原文链接 Vue 开发一个单页面应用,相信很多前端工程师都已经学会了,但是单页面应用有一个致命的缺点,就是 SEO 极不友好.除非,vue 能在服务端渲染(ssr)并直接返回已经渲染好的页面,而并非只 ...

  6. 🏃‍♀️点亮你的Vue技术栈,万字Nuxt.js实践笔记来了~

    前言 作为一位 Vuer(vue开发者),如果还不会这个框架,那么你的 Vue 技术栈还没被点亮. Nuxt.js 是什么 Nuxt.js 官方介绍: Nuxt.js 是一个基于 Vue.js 的通用 ...

  7. Nuxt.js服务端渲染实践,从开发到部署

    感悟 经过几个周六周日的尝试,终于解决了服务端渲染中的常见问题,当SEO不在是问题的时候,或许才是我们搞前端的真正的春天,其中也遇到了一些小坑,Nuxt.js官方还是很给力的,提issue后很积极的给 ...

  8. Feathers JS – 基于 Express 构建数据驱动的服务

    Feathers 是一个轻量的 Web 应用程序框架,基于 NodeJS 最流行​​的 Web 框架——Express.这使得它很容易使用 socket.io 来创建 RESTful Web 服务和实 ...

  9. next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序

    前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...

随机推荐

  1. hdu1527

    hdu1527两堆博弈模型,威佐夫博弈 #include<iostream> #include<cstdio> #include<queue> #include&l ...

  2. HZOI20190828模拟32题解

    题面:https://www.cnblogs.com/Juve/articles/11428730.html chinese: 考虑$\sum\limits_{i=0}^{n*m}i*f_i$的意义: ...

  3. vue.js_09_vue-父子组件的传值方法

    1.父向子传递数据 1>定义一个父组件和一个子组件 2>父组件通过v-bind绑定传递的数据  :parentmsg="msg" 3>子组件需要通过 props: ...

  4. codec engine工程中使用ccs下编译的lib库

    原文地址:codec engine工程中使用ccs下编译的lib库--转作者:木子小白 这两天将dsp的算法程序放到ccs下,生成lib库文件 这样的好处就是: 1. 算法封装成lib库以后,看不到源 ...

  5. jsonp 请求报Uncaught SyntaxError: Unexpected token :

    $(document).ready(function() { jQuery.ajax({ type: 'GET', url: 'http://wncrunners.com/admin/colors.j ...

  6. []==![] 为什么等于true?

    最近碰到这样一个问题: []==![]  为什么等于true? 首先分析  !的优先级较==高,先运算==两侧的操作数: typeof []; //"object" typeof ...

  7. Spring事务传播行为详解

    前言 Spring在TransactionDefinition接口中规定了7种类型的事务传播行为.事务传播行为是Spring框架独有的事务增强特性,他不属于的事务实际提供方数据库行为.这是Spring ...

  8. jsp页面el表达式<c:choose> <c:when的用法

    等于 是if else <c:choose> <c:when test="${paginationModel.py_province != ''}"> 如果 ...

  9. jnhs[未解决]无法使用选定的hibernate配置文件建立数据库连接.请验证hibernate.cfg.xml中的数据库连接详情信息

    工程可以正常的使用读写数据库,当然model和model.hbm.xml文件是自己写的. 解决中

  10. 为什么要使用ul li布局网站导航条?使用ul li布局网站网页导航必要性

    会布局的都知道网站导航条布局非常重要,可能一个导航条最终布局效果有时可以使用ul li列表标签布局,有时可以不用ul li布局,而是直接一个div盒子里直接放锚文本超链接的栏目名称,也能实现,看下图. ...