vue 项目判断是PC端还是移动端
这些js可以另外建一个.js的文件来写，到时候导出使用
有关浏览器类型的信息都藏在USER-AGENT里面，首先读取navigator.userAgent里面的信息，为了方便利用toLowerCase方法转成小写的形式。
1.判断是否是微信环境的
2.判断是否是移动端的环境
3.我的项目是移动端和pc端写在一个项目里面的，没有分开写，但是页面和路由有分开，如果是移动端的，我会在前面加一个/mb/xxx/:id的路由，如果是pc端的，我会在路由里面/pc/xxx/:id这样来写，到时候在mian.js里面做一个判断
4.在main.js导入，然后做一个判断
大概就是这些，有些东西有删减，可能不是很完整
号称目前最火的前端框架Vue，它有什么显著特点呢？
1、Vue是什么
Vue.js 是目前最火的一个前端框架，除了可以开发网站，还可以开发手机App。
Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架。
Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。
Vue.js 是一套用于构建用户界面的渐进式框架。
2、Vue的特点
遵循 MVVM 模式
编码简洁，体积小，运行效率高，适合移动/PC 端开发
它本身只关注 UI, 可以轻松引入 vue 插件或其它第三库开发项目
3、Vue与其他前端框架的关系
借鉴 angular 的模板和数据绑定技术
借鉴 react 的组件化和虚拟 DOM 技术
4、Vue的现有插件
vue-cli: vue 脚手架，用于搭建项目的骨架
vue-resource(axios): ajax 请求
vue-router: 路由
vuex: 状态管理
vue-lazyload: 图片懒加载
vue-scroller: 页面滑动相关
mint-ui: 基于 vue 的 UI 组件库(移动端)
element-ui: 基于 vue 的 UI 组件库(PC 端)
5、学习Vue的思想改变
Vue的中心思想是数据驱动，像远古时代的老前辈jQuery是结构驱动。
大家回忆下以前我们使用jQuery写代码的时候，经常是这样写的：
$("#myDiv").html("HelloWorld");
这些写法首先要获取Dom节点，也就是Dom结构，然后再修改数据更新结构的内容，使用jQuery的一个很大的目的就是为了去简化Dom的操作，而使用Vue就大不一样了，Vue的做法就是直接this.msg=HelloWorld，然后msg就会自动的同步到结构上，我们所要关心的是数据内容的改变，而不再去关心如何操作Dom结构了。
总结一句话：不要在想着怎么操作DOM，而是想着如何操作数据!!
VUE 判断电脑还是手机设备 pc端自适应 移动端rem布局
pc端所有的页面和移动端都写在一个项目里
这时候就需要我在登录的时候判断是什么设备 然后跳到相应的页面 采用不同的样式
可以写在一个js文件里，然后在main.js里统一引入
如果是手机端的话 我要采用rem布局 设计稿是640px的标准
如果是pc端的话 我需要页面自适应 设计稿是宽1920px的标准 并且当电脑屏幕尺寸小于1024px(一般来讲最小的电脑尺寸就是1024px),就不让页面继续缩小了 否则样式错乱,影响用户体验.
转自
vue2.0项目上线后，进去后变成如图所视，刷新没用，必须关掉移动端在进去才有用，怎么回事？
一、前言
之前我们通过nodejs并利用vuecli来创建vue项目，非常方便的就实现了前后端一体化的操作。不过在项目开发的时候为了提高开发效率我们需要依赖于一些插件帮助我们提高开发效率，那么今天我们就来介绍一些优秀的vue插件并且学会如何制作属于自己的插件。
二、单文件组件
在我们之前讲到的 nodejs轻松创建第一个vue应用中篇，这篇文章的时候，我们创建了一个vue的原生应用，效果如图所示：
那么现在我们需要把默认的页面换成其它的vue组件来显示，首先我们创建一个几个js文件，如图：
然后创建一个vue组件并设置组件的属性，如图：
然后我们将组件添加到入口组件中，如图：
此时的test组件就能被应用到该项目的页面中了，我们来启动一下这个应用，如图：
此时就实现了页面内容的更新。其实这里是相当于把我们的vue做成了一个单文件组件，之前我们在学习vue的时候，一直都是依赖于html文件存在的，不过如果你是想要在nodejs上运行的话，还可以使用单文件组件，当然，单文件组件是我们极力提倡的写法。
三、UI组件
我们都知道，前端发展到现在，对于用户的体验和视觉感受都非常重视，因此就出现了很多的UI组件库，比如Elementui、vant、iview、Vuetify、 Mint UI、ant-design-vue等，下面我们将以pc端和移动端为主，分别介绍两款不同的UI组件库给大家认识并且简单的使用一下，来领略下UI组件的魅力吧。
1.PC端UI组件 1).ElementUi
由饿了么前端团队开源的UI框架，可以说是目前为止最好的桌面端UI组件库了，不仅界面美观，而且极易上手，下面我们来安装一下，首先在项目目录下打开cmd，然后输入命令：
npm i element-ui -S
静静的等着下载好这个组件库就好了。然后我们将组件引入vue组件中，并对组件的结构进行重构，如图：
这样就可以将一些花哨的元素添加进去了。
2).Ant Design Vue
旨在于开发后台管理系统界面，如下：
npm install iview --save
安装好了之后还是引入它，然后使用，如图：
可以看到，我们可以同时使用多个组件库。
3).iview
主要用于后端界面的开发，如下：
npm install iview --save
除此之外，iview weapp也是一款不错的ui框架，不过它主要用于微信小程序开发。
2.移动端组件 1).vuetify
最先将它是因为他不仅支持移动端而且还支持pc端，做到了多端兼容，而且无需写css就能实现非常美观的界面。首先下载，如下：
npm install --save vuetify
2).vant
下载安装，如下：
npm i vant -S
3).Mint UI
也是饿了么前端团队开发的基于移动端的组件库，首先来下载安装，如图：
npm i mint-ui --save
四、插件
可以看到，我们所使用的每个组件库要想使用，都必须下载，然后在主入口js文件main.js中导入并使用Vue.use这个方法来将该组件库加入到项目中去，已达到全局通用的效果。下面开始我们的插件编写之旅，首先创建一个放置插件的文件夹，然后建立如下文件，如图：
以上创建的便是一个插件目录和文件，然后我们来写单文件vue页面，如下：
然后我们以模块化的形式导出单页面文件，如图：
紧接着我们注册刚才写好的插件，如图：
最后我们将其应用在app.vue文件中，如图：
此时咱们写的插件就能应用到页面中了，如图：
五、总结
Vue.js能做PC端单页式网站开发吗
完全可以。
1、另一方面，Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用，实现PC端单页式的前端开发。
2、PC端网站在不需要优先考虑SEO和首屏渲染时间时，单页式在用户体验和开发体验(开发效率)上是完胜多页式的。
3、vue.js作为主流框架之一，同样支持SSR，vue.js的PC端网站开发时服务端渲染编译比较慢，使用用单页式效率更高。
扩展资料：
主流框架Vue.js与angularjs的开发区别：
一、相同点：
都支持指令：内置指令和自定义指令。
都支持过滤器：内置过滤器和自定义过滤器。
都支持双向数据绑定。
都不支持低端浏览器。
二、不同点：
1、AngularJS的学习成本高，比如增加了Dependency Injection特性，而Vue.js本身提供的API都比较简单、直观。
2、在性能上，AngularJS依赖对数据做脏检查，所以Watcher越多越慢。
3、Vue.js使用基于依赖追踪的观察并且使用异步队列更新。所有的数据都是独立触发的。对于庞大的应用来说，这个优化差异还是比较明显的。
参考资料：vue.js官网-介绍-Vue.js
vue | 判断移动端还是pc端渲染不同的页面
把pc端和移动端写在同一个项目中,需要判断设备终端进行不同的渲染页面,此时需要根据判断不同的设备终端设置跳转不同的路由。
1.在router中配置两个不同的路由地址入口,
2.在 App.vue 的 mounted 方法中对设置进行判断
3.在 App.vue 的 methods中设置_isMobile()函数
如此就大功告成!!!实现了在同一个项目中判断移动端还是pc端,通过路由渲染不同的页面.