使用nuxt.js官方脚手架构建koa2的es6编译问题

时间: 2018-12-23阅读: 1145标签: nuxt

最近在学用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

站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/1674

关闭

nuxt.js的使用和开发,一款vue基于服务器SSR渲染工具

一款基于Vue.js的SSR框架——Nuxt.js。是vue进行SSR的一个优选开源项目,可免去繁琐的Webpack、nodejs后台服务配置等操作,方便的搭建一个支持SSR的vue项目。

nuxt框架中对vuex进行模块化设置

Nuxt.js 内置引用了 vuex 模块,所以不需要额外安装。Nuxt.js 会尝试找到应用根目录下的 store 目录,如果该目录存在,它将做以下的事情:Nuxt.js 支持两种使用 store 的方式:普通方式: store/index.js 返回一个 Vuex.Store 实例

服务端预渲染之Nuxt

现在前端开发一般都是前后端分离,mvvm和mvc的开发框架,如Angular、React和Vue等,虽然写框架能够使我们快速的完成开发,但是由于前后台分离,给项目SEO带来很大的不便,搜索引擎在检索的时候是在网页中爬取数据

nuxt.js中添加统计代码,添加百度统计,或者google的统计

在 Nuxt.js应用中使用Google统计分析服务,或者百度统计分析服务,推荐在 plugins 目录下创建 plugins/ga.js 文件。

精读《Nuxtjs》

Nuxt 是基于 Vue 的前端开发框架,这次我们通过 Introduction toNuxtJS 视频了解框架特色以及前端开发框架的基本要素。nuxt 与 next 结构很像,可以结合在一起看

Nuxt使用axios跨域问题解决方法

Nuxt 是 Vue 项目服务器端渲染(SSR)解决方案。而在使用时,就会遇到前后端分离情况下的域名或端口不一致导致的跨域问题。本文将介绍如何通过设置代理解决 Nuxt 与 axios 集成的跨域问题。

使用Nuxt生成静态网站

静态网站如今再次流行起来了。信息站和品牌宣传站不再需要使用WordPress之类的内容管理系统来动态更新。使用静态网站生成器,您可以从无源CMS,API

Nuxt.js部署应用的方式

Nuxt.js 提供了两种发布部署应用的方式:服务端渲染应用部署 和 静态应用部署。静态应用部署就不说了,主要说说服务端渲染应用部署。每次在服务器上执行nuxt build,总是有如下报错,并且jenkins会随之挂掉。

Webstorm环境使用nuxt.js做开发,@ 和 ~ 别名配置

webstorm 设置@和~别名,有助于代码查看和跳转.在项目下创建一个webpack.config.js,内容如下;设置 IDE:webstorm -> file -> settings -> language & frameworks -> javascript -> webpack

使用Nuxt.js创建服务器端渲染的Vue.js应用程序

Nuxt.js基于名为Next的热门React库的SSR实现。 为Vue设计了一个名为Nuxt的类似实现。 熟悉React + Next组合的人会在应用程序的设计和布局中发现一些相似之处。 但是,Nuxt提供Vue特有的功能来为Vue创建强大且灵活的SSR解决方案。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!