Nuxt框架起步

 

安装报错

Nuxt.js 是一个基于 Vue.js 的通用应用框架。

 

通过对客户端/服务端基础架构的抽象组织，Nuxt.js 主要关注的是应用的 UI渲染。

Nuxt.js 预设了利用 Vue.js 开发服务端渲染的应用所需要的各种配置。由于它是一个在服务器进行渲染的框架，

所以很适合用来做SEO。

 

官方网址： https://zh.nuxtjs.org/guide

 

安装语句：$ npx create-nuxt-app <项目名>

此时可能会出现如下报错：
C:\Users\Administrator\AppData\Roaming\npm-cache\_npx\18012\node_modules\create-nuxt-app\node_modules\sao\lib\installPackages.js:108
        throw new SAOError(`Failed to install ${packageName} in ${cwd}`)
        ^SAOError: Failed to install packages in C:\Users\Administrator\Desktop\Dome\topology-vue


解决方案：
Might be a cache issue, try installing without using your NPM cache:
npm install --cache /tmp/empty-cache

If so, clean your NPM cache by running:
npm cache clean --force

 

　　

Nuxt框架模块安装使用

　　1. 进入项目目录下载对应的模块

npm i element-ui -S

 

　　  2. 在项目的plugin文件下创建ElementUI.js文件，内容如下

  import Vue from 'vue'
  import ElementUI from 'element-ui'
  Vue.use(ElementUI)

　　  3. 在nuxt.config.js 中添加配置， 配置好后就可以npm run dev 了（对了找到对应的组件添加：<el-button>试试看</el-button>）

   css: [
     'element-ui/lib/theme-chalk/index.css'  // 引入全局样式
   ],
   plugins: [
     {src: '~/plugins/ElementUI', ssr: true } // ssr:true代表在服务端渲染,客户端不渲染
   ],
   build: {
     vendor: ['element-ui'] // 防止重复重复打包
   }