使用nuxt.js官方脚手架构建koa2的es6编译问题
最近在学用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编译问题的更多相关文章
- 使用nuxt.js官方脚手架构建项目时ES6编译问题SyntaxError: Unexpected token import
用nuxt集成koa2做vue后台,官方自带脚手架搭建的koa2仍是ES5语法,在构建koa2时默认的nodemon是没有使用babel编译的, 所以首先需要在启动命令后加上--exec babel- ...
- Vue.js项目脚手架构建
vue.js文档:https://cn.vuejs.org/v2/guide/ 参考这个或者参考菜鸟教程也可以,不过还是那句话官网权威. 我这个主要是看相关的学习视频搭建的. 一.环境准备 环境准备( ...
- node.js应用脚手架:koa2、sequelize、mysql
自制了一个 nodejs 应用的脚手架. 基于 koa2 的,所以需要保证 node 环境至少为 7.6.0 吸取了以前的踩坑教训,添加了守护进程,确保应用不会因为异常导致网站直接挂掉(使用了 for ...
- Nuxt.js项目实战
感悟 经过几个周六周日的尝试,终于解决了服务端渲染中的常见问题,当SEO不在是问题的时候,或许才是我们搞前端的真正的春天,其中也遇到了一些小坑,Nuxt.js官方还是很给力的,提issue后很积极的给 ...
- Nuxt.js 基础入门教程
原文链接 Vue 开发一个单页面应用,相信很多前端工程师都已经学会了,但是单页面应用有一个致命的缺点,就是 SEO 极不友好.除非,vue 能在服务端渲染(ssr)并直接返回已经渲染好的页面,而并非只 ...
- 🏃♀️点亮你的Vue技术栈,万字Nuxt.js实践笔记来了~
前言 作为一位 Vuer(vue开发者),如果还不会这个框架,那么你的 Vue 技术栈还没被点亮. Nuxt.js 是什么 Nuxt.js 官方介绍: Nuxt.js 是一个基于 Vue.js 的通用 ...
- Nuxt.js服务端渲染实践,从开发到部署
感悟 经过几个周六周日的尝试,终于解决了服务端渲染中的常见问题,当SEO不在是问题的时候,或许才是我们搞前端的真正的春天,其中也遇到了一些小坑,Nuxt.js官方还是很给力的,提issue后很积极的给 ...
- Feathers JS – 基于 Express 构建数据驱动的服务
Feathers 是一个轻量的 Web 应用程序框架,基于 NodeJS 最流行的 Web 框架——Express.这使得它很容易使用 socket.io 来创建 RESTful Web 服务和实 ...
- next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序
前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...
随机推荐
- vue @click传字符串
参考: https://www.cnblogs.com/springlight/p/5782637.html 关键:使用转译字符 \ 来转译引号 方法一. 直接传递: var tem = " ...
- 03.Hibernate配置文件之核心配置文件
一.核心配置文件的两种配置方式 1.属性文件方式 hibernate.properties(基本不会选用 hibernate.connection.driver_class=com.mysql.jdb ...
- Gym - 100543L
Gym - 100543Lhttps://vjudge.net/problem/153854/origin区间dp,要从区间长度为1开始dp #include<iostream> #inc ...
- 移动端iPhone系列适配问题
问题一:苹果手机上的input按钮自带渐变效果 一样的代码,为啥在苹果手机上的input按钮就自带渐变效果,搞特殊吗?怎么让它显示正常?只需要加上outline:0px; -webkit-appear ...
- 享元模式(Flyweight、FlyweightFactory)(围棋棋子共享)
(使用共享对象可有效地支持大量的细粒度的对象.) 假设开发一个围棋程序,围棋程序的围棋的棋子包含了颜色.大小.位置等信息.在定义一个棋盘容器来存放这些棋子. 我们可以发现,棋盘的成员变量包含了一个棋子 ...
- [Array]283. Move Zeroes
Given an array nums, write a function to move all 0's to the end of it while maintaining the relativ ...
- beego 入门 - 常见错误
参考网址:http://beego.me/quickstart 按照官网教程,执行命令 $ go get github.com/astaxie/beego $ go get github.com/be ...
- Tomcate 启动异常,java.net.BindException: Address already in use: JVM_Bind:80的解决办法
一直用Tomcat,但是前几天突然报错: java.net.BindException: Address already in use: JVM_Bind:80 第一反应就是80端 ...
- git图形化
在windows下安装git中文版客户端并连接gitlab 转载自:https://blog.whsir.com/post-1801.html 下载git Windows客户端 git客户端下载地址: ...
- Django+小程序技术打造微信小程序助手
Django+小程序技术打造微信小程序助手 整个课程都看完了,当前这个课程的分享可以往下看,下面有某盘的链接,之前做java开发也做了一些年头,也分享下自己看这个视频的感受,同时也分享下自己的总结 ...