配置不同的样式预处理语言需要安装的包
less样式的加载器在依赖安装好以后就可以开始在assets里开发对应的样式了
在nuxt.config.js文件中的css项中引入需要使用的样式文件
如果报错，提示this.getOptions is not a function at Object.lessLoader ，那么可以先查看当前的less-loader的版本信息，打开package.json文件，查看less-loader
这里的是8.0的版本，解决方案是将less-loader的版本回退至7.0版本
base.less：
myButton.vue：
default.vue：
nuxt.config.js：
Step1：导入rem计算公式；1. 创建：在src目录下创建config文件夹并在目录下创建rem.js文件写入如下代码；(function(){function a(){var b=document.documentElement.clientWidthb=b>750?750:bvar c=b/750*100document.getElementsByTagName("html")[0].style.fontSize=c+"px"}a()window.onresize=a})()2. 引入：在src\main.js中导入之前创建的js文件；import './config/rem.js'Step2：安装并设置px2rem插件；1. 安装：$ cnpm install px2rem-loader2. 设置：在项目中找到build\utils.js，定位至function generateLoaders在其上方定义如下：var px2remLoader = {loader: 'px2rem-loader',options: { remUnit: 50 /* 此处50为可调整的值 */}} // 以上的添加的px2rem的定义// 在下方generateLoaders方法中添加[cssLoader,px2remLoader]// generate loader string to be used with extract text pluginfunction generateLoaders (loader, loaderOptions) {const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader,px2remLoader] /* 此处为添加的定义 */备注：remUnit: 50 /* 此处50为可调整的值 */此处50由设计稿尺寸决定（eg：当设计稿为375时，打开网页进入调试模式将网页宽度调整至与设计稿相同，得到的html的font-size即为需要设置的值）<html style="font-size: 50px">1540711565379.pngStep3：使用px2rem插件；1. 使用：直接设置css样式使用px单位即可，如果不需要自动转换则在其后面加上/*no*/<style scoped>.detail-page {width: 20px height: 40px/*no*/}</style>作者：起个名字那么难吗链接：https://www.jianshu.com/p/3c096e268e9f来源：简书简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。vue单页面应用渲染是从服务器获取所需js，在客户端将其解析生成html挂载于id为app的DOM元素上，这样会存在两大问题。
除此之外，nuxt与vue还有一些其他方面的区别。
下图为关于nuxt的简单概述
vue文件中可直接使用
sass文件如需解析，nuxt.config.js中配置css属性
封装axios，解决每个请求前加baseURL
plugins/axios.js
index.vue
为避免每个页面都引入moment，执行 moment.locale('zh-cn') ，可将其定义为全局方法
icon.png文件存放在static文件夹下，nuxt.config.js中配置head属性
中间件存放于middleware文件夹下，按使用场景可分为全局中间件和单页面中间件
中间件执行流程顺序：
nuxt.config.js ->匹配布局 ->匹配页面
按照index.vue通过 require('mini-toastr') 引入miniToastr，运行程序报错如下
打印miniToastr发现为一Module对象，init挂载在其default属性上
所以修改引入方法为
为什么需要require().default
关于如上介绍，测试关于两种模块的导出方法
方式一：export default
新建test.js文件
vue页面导入
此时 require('~/plugins/con.js') 打印为
方式二：module.exports
此时 require('~/plugins/con.js') 打印为
