118页Vue面试题总结，为面试提前做准备
Vue面试题文档内容主要包括vue-cli工程，vue核心知识点，vue-router，vuex，http请求，UI样式，常用功能，MVVM设计模式，深入拓展。
vue-cli工程
1、构建的 vue-cli 工程都到了哪些技术，它们的作用分别是什么？
(1)vue.js：vue-cli工程的核心，主要特点是 双向数据绑定 和 组件系统。
(2)vue-router：vue官方推荐使用的路由框架。
(3)vuex：专为 Vue.js 应用项目开发的状态管理器，主要用于维护vue组件间共用的一些 变量 和 方法。
(4)axios（ 或者 fetch 、ajax ）：用于发起 GET 、或 POST 等 http请求，基于 Promise 设计。
(5) vux等：一个专为vue设计的移动端UI组件库。
(6)创建一个emit.js文件，用于vue事件机制的管理。
(7) webpack：模块加载和vue-cli工程打包器。
2、vue-cli 工程常用的 npm 命令有哪些？
下载 node_modules 资源包的命令：
npm install
启动 vue-cli 开发环境的 npm命令：
npm run dev
vue-cli 生成 生产环境部署资源 的 npm命令：
npm run build
用于查看 vue-cli 生产环境部署资源文件大小的 npm命令：
npm run build --report
3、请说出vue-cli工程中文件夹和文件的用处
vue-cli目录解析：
(1) build 文件夹：用于存放 webpack 相关配置和脚本。开发中仅 偶尔使用 到此文件夹下 webpack.base.conf.js 用于配置 less、sass等css预编译库，或者配置一下 UI 库。
(2) config 文件夹：主要存放配置文件，用于区分开发环境、线上环境的不同。 常用到此文件夹下 config.js 配置开发环境的 端口号、是否开启热加载 或者 设置生产环境的静态资源相对路径、是否开启gzip压缩、npm run build 命令打包生成静态资源的名称和路径等。
(3) dist 文件夹：默认 npm run build 命令打包生成的静态资源文件，用于生产部署。
**(4) node_modules：存放npm命令下载的开发环境和生产环境的依赖包。
(5) src: 存放项目源码及需要引用的资源文件。
(6) src下assets：存放项目中需要用到的资源文件，css、js、images等。
(7) src下componets：存放vue开发中一些公共组件：header.vue、footer.vue等。
(8) src下emit：自己配置的vue集中式事件管理机制。
(9) src下router：vue-router vue路由的配置文件。
(10) src下service：自己配置的vue请求后台接口方法。
(11) src下page：存在vue页面组件的文件夹。
(12) src下util：存放vue开发过程中一些公共的.js方法。
(13) src下vuex：存放 vuex 为vue专门开发的状态管理器。
(14) src下app.vue：使用标签<route-view></router-view>渲染整个工程的.vue组件。
(15) src下main.js：vue-cli工程的入口文件。
(16) index.html：设置项目的一些meta头信息和提供<div id="app"></div>用于挂载 vue 节点。
(17) package.json：用于 node_modules资源部 和 启动、打包项目的 npm 命令管理。
4、config文件夹 下 index.js 的对于工程 开发环境 和 生产环境 的配置
(1) index：配置打包后入口.html文件的名称以及文件夹名称
(2) assetsRoot：配置打包后生成的文件名称和路径
(3) assetsPublicPath：配置 打包后 .html 引用静态资源的路径，一般要设置成 “./”
(4) productionGzip：是否开发 gzip 压缩，以提升加载速度
dev 对象下对于开发环境的配置：
(1) port：设置端口号
(2) autoOpenBrowser：启动工程时，自动打开浏览器
(3) proxyTable：vue设置的代理，用以解决跨域问题
5、请你详细介绍一些 package.json 里面的配置
常用对象解析：
(1) scripts：npm run xxx 命令调用node执行的 .js 文件
(2) dependencies：生产环境依赖包的名称和版本号，即这些 依赖包 都会打包进 生产环境的JS文件里面
(3) devDependencies：开发环境依赖包的名称和版本号，即这些 依赖包 只用于 代码开发 的时候，不会打包进 生产环境js文件 里面。
CSS面试题文档，JavaScript面试题文档，Vue面试题文档，大厂面试题总结，点击这里可免费领取！
vue核心知识点
1、对于Vue是一套渐进式框架的理解
2、vue.js的两个核心是什么？
3、请问 v-if 和 v-show 有什么区别
4、vue常用的修饰符
5、v-on可以监听多个方法吗？
6、vue中 key 值的作用
7、vue-cli工程升级vue版本
8、vue事件中如何使用event对象？
9、$nextTick的使用
10、Vue 组件中 data 为什么必须是函数
11、v-for 与 v-if 的优先级
12、vue中子组件调用父组件的方法
13、vue中 keep-alive 组件的作用
14、vue中如何编写可复用的组件？
15、什么是vue生命周期？
16、vue生命周期钩子函数有哪些？
17、vue如何监听键盘事件中的按键？
18、vue更新数组时触发视图更新的方法
19、vue中对象更改检测的注意事项
20、解决非工程化项目初始化页面闪动问题
21、v-for产生的列表，实现active的切换
22、v-model语法糖的组件中的使用
23、vue中自定义过滤器
24、vue等单页面应用及其优缺点
25、什么是vue的计算属性？
26、vue-cli提供的几种脚手架模板
27、vue父组件如何向子组件中传递数据？
28、vue弹窗后如何禁止滚动条滚动？
29、计算属性的缓存和方法调用的区别
30、vue-cli中自定义指令的使用
vue-router
1、vue-router如何响应 路由参数 的变化？
2、完整的 vue-router 导航解析流程
3、vue-router有哪几种导航钩子（ 导航守卫 ）？
4、vue-router传递参数的几种方式
5、vue-router的动态路由匹配
6、vue-router如何定义嵌套路由？
7、<router-link></router-link>组件及其属性
8、vue-router实现路由懒加载（ 动态加载路由 ）
9、vue-router路由的两种模式
10、history路由模式配置及后台配置
CSS面试题文档，JavaScript面试题文档，Vue面试题文档，大厂面试题总结，点击这里可免费领取！
vuex
1、什么是vuex？
2、使用vuex的核心概念
3、vuex在vue-cli中的应用
4、在vue中使用vuex，修改state的值
5、vuex actions异步修改状态
http请求
1、Promise对象是什么？
2、axios、fetch与ajax有什么区别？
3、什么是JS的同源策略和跨域问题？
4、如何解决跨域问题？
5、axios有什么特点？
UI样式
1、.vue组件的scoped属性的作用
2、如何让CSS只在当前组件中起作用？
3、vue-cli中常用的UI组件库
4、如何适配移动端？【 经典 】
5、移动端媒体查询
6、vue内容垂直和水平居中
7、vue-cli引入图片的方法
8、移动端常见样式问题
9、文本超出隐藏
常用功能
1、vue中如何实现tab切换功能？
2、vue中keep-alive 实现标签页组件缓存
3、vue中实现页面从右往左侧滑入效果
4、vue中父子组件如何相互调用方法？
5、vue*事件总线的使用
MVVM设计模式
1、MVC、MVP与MVVM模式
2、MVC、MVP与MVVM的区别
3、MVVM的实现原理
4、Object.defineProperty()方法
5、 ES6中定义的类和对象
6、JS中的文档碎片
7、解构赋值
8、Array.from
9，Array.reduce
10、递归的使用
11、Obj.keys()与Obj.defineProperty
12、发布-订阅模式
13、vue项目优化，缩短首屏加载时间
深入拓展
1、vue开发命令 npm run dev 输入后的执行过程
2、vue的服务器端渲染
3、从零写一个npm安装包
4、vue-cli中常用到的加载器
5、webpack的特点
结语：需要前端学习资料或者想要学习前端的小伙伴可以加入前端裙：953 352 883 一起交流学习，CSS面试题文档，JavaScript面试题文档，Vue面试题文档，大厂面试题总结，都可以免费获取！
本文地址：https://blog.csdn.net/QXXXD/article/details/112463826
下一篇： CSS如何实现响应式设计