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

附上 babel配置-各阶段的stage的区别

3.在根路径创建.babelrc文件，写入配置

.babelrc

{
    "presets": ["es2015","stage-0"]
}

4.重新启动项目即可

posted @ 2018-11-29 00:08  道理我都懂Zz  阅读(4743)  评论(1)  编辑  收藏  举报