node(vue+nuxt) 踩坑日记（一）：关于nuxt的缺陷

作为一名后端程序员，本来前端基础就比较薄弱，刚一开始了解node还是从nuxt开始的，难免有些不知所措，但也没有办法，项目催的急，不得不借助框架。在此记录下刚接触nuxt框架所踩过的坑，后续会慢慢补上对于node的基础学习。

1、nuxt官方脚手架存在的问题：

首先回顾一下官方脚手架的创建过程：

a、全局安装npx(npx 会帮你执行依赖包里的二进制文件，不过据说npm version >=5.2已经内置了npx，咱也不知道，反正我是手动安装了一遍。。。)：

npm install -g npx

b、创建官方脚手架：

npx create-nuxt-app 你项目的名字

c、官方脚手架默认不支持ES6，需要手动添加支持：

在你的项目文件夹下：

npm install babel-cli babel-preset-es2015

然后修改package.json中scripts中的dev和start，在最后添加一句：--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"
  },

最后，切记在项目根目录下创建一个文件：.babelrc，内容如下：

{
  "presets": ["es2015"]
}

d、nuxt框架默认不支持scss，需手动安装：

npm i sass-loader node-sass

二、nuxt项目如何打包发布：

最简单的办法：在项目根目录下，命令行：

npm run generate

会生成一个dist文件夹，直接丢到nginx服务器上就可以了。

还有一个复杂的方法，就是用npm run build，我还没研究明白这种方法怎么部署，后面再说