vue 2.0 请教项目适配移动端和电脑端，抽取 js 部分，样式独立

Question

在已有的 pc 项目下再建立一个移动端项目，然后打算将 pc 中的方法都分别按模块写到另外一个 function 文件夹中，而 pc 和移动端里面的 文件.vue 就仅仅写 template 和 style，然后在 index.html 中引入所有模块的 function/各种模块.js 文件，请问这样的做法合适吗？一个项目既然要有移动端又有电脑端主流的做法都是怎么做的呢？

当然在路由中判断是进入 pc 还是移动端的页面。

请大家不吝指教，谢谢。

Answer 1

navigator.userAgent试试？

Answer 2

1. 如果你的移动端和 PC 端产品存在很大的功能差异，那么可以考虑用两套逻辑实现，不然的话，建议还是一套
2. 一套逻辑：使用响应式的样式，尽量采用流式布局（不写死宽高，自适应）
3. 两套逻辑：服务器端通过 userAgent 输出不同的页面；公共部分建立公公类库，使用 npm 或者 git submodule 管理

Answer 3

• 个人认为可以用将vue使用变成多页，这是本站关于多页的文章
• 然后入口分成pc端和mobile端两个，根据userAgent来判断设备是哪个端的

if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
    window.location.href = "移动端url";
} else {
    window.location.href = "pc端url";
}

估计多页的配置有点小麻烦，不过这样代码结构也会比较清晰吧。