Nuxt项目配置支持sass和bulma按模块加载

Bulma 好用，不过对于一个“高级”UI组件项目来说，一次全部组件样式加载，也是一个不太拿得出手的事。项目进行了一部分，重新改造一下吧！

重新安装Nuxt项目，官方推荐了两种方式，之前测试过，用yarn的方式下载模板真快啊，不过安装依赖的时候就报错，不知道为什么，前几天还没这个问题；那就继续用npx的方式吧，虽然慢点，不过能安装成功，不多说

npx create-nuxt-app <项目名>
yarn create nuxt-app <项目名>

安装过程中的选择
1. 在上篇文章讨论了，新版本的Nuxt已经不能选择服务器端框架了，需要自己配置，请参考上次的文章
2. UI类库肯定还是选择Bulma，不过不用Nuxt自己封装的了。我看了源码，目前Bulma的最新版本是0.9，Nuxt里面封装的Bulma版本是0.8，所以选择UI框架的时候，不做选择，后面自己安装。详请如下

// 安装bulma
  npm install bulma --save
// nuxt.config.js
  css: [
    'bulma/css/bulma.min.css',
    'font-awesome/css/font-awesome.min.css',
    '@/assets/css/base.css'
  ]

注意：这里还是全部引入了Bulma的样式，不是本文讨论的重点，只是说明可以用这样的方式替代掉默认的Bulma

Axios是不是要选择Nuxt中自己封装的？
1. Nuxt的文档中强烈的推荐用他们自己封装的Axios，而且他们还专门针对自己封装的Axios写了比较详细的文档，用它会省去很多麻烦
2. 我也尝试了几个项目了，是不用做什么操作就可以直接用了（可以看之前的文章），不过真是感觉很不习惯。特别是我们单独封装的数据层后，不能直接从封装好的'@nuxtjs/axios'中导入axios对象，只能把$axios对象从vuex中传到数据层，感觉有点不忍直视
3. 官方文档给出的用Nuxt封装的理由就是他们是用的单个axios实例，我们也自己封装下就行，其实之前也都是这么做
安装sass

// 安装开发时依赖
npm install node-sass sass-loader --save-dev
// vue组件中
<style lang="sass" scoped>
  @import "bulma/sass/utilities/_all.sass"
  @import "bulma/sass/elements/button.sass"
</style>

如上面代码，开发一个UI组件项目，就可以按需按模块引入Bulma，UI组件库的体积肯定会小；而且最重要的是我们可以对用户“隐藏”Bulma，让我们的用户不需要学习Bulma，甚至都感受不到Bulma的存在，而很方便的做出漂亮的界面和元素！