1、new Date()兼容性问题:在ie中new Date('2020-02-12').getTime()结果是NaN,在谷歌上没有问题,解决方法:把字符串中所有的‘-’替换成‘/’。
2、记一次项目中使用v-if和v-show的经验:点击按钮有一个弹框弹出来,弹窗是有z-index这个样式设置的,我当时用的是v-show让这个弹窗显示,v-show是浏览器正常渲染dom的,只不过是隐藏的,结果弹窗的z-index导致我页面的select无法正常显示
3、代码分割:(1)单页面应用:减少文件体积,拆分应用,把需要异步加载的内容改成异步加载,多页面应用:多依赖提取,因为浏览器是缓存js和css的,所以提取出来只加载一次
代码分割的目的:为了业务代码的纯净,有时不希望业务代码里混入第三方代码,或webpack配置代码,把第三方的代码和webpack配置代码拆分为单独文件
CommonsChunkPlugin是分割代码的,webpack3是使用这个插件,webpack4使用optimization: {
splitChunks: {
chunks: 'all'
}
}
异步引入模块,import和require,import(/webpackChunkName:'asd'/'modulea.js').then((res)=>{}),require([],function(){require('module.js')},'abc'),第三个参数是对模块的命名
4、热更新:保持页面状态不刷新浏览器的情况下即可看见更改的效果,hotmodulereplacementplugin 热替换插件,更改css代码,devServer:{
port:902,
hot:true.
hotOnly:true},module是webpack的全局的变量
5、webpack-dev-server是怎么搭建的
express:开启服务,webpack-dev-middleware,webpack-hot-middleware,http-proxy-middleware开发模式中间件,connection-history-api-fallback:重写路径
6、loader本质上是一个方法,注册loader,对于的文件内容给到loader,loader方法处理内容,方法return结果,对某一种类型的统一处理;plugin本质是监听生命周期,注册plugin,插件接收到webpack编译过程,今天某个生命周期,当编译到达某个生命周期时会自动的调用插件的监听
7、Babel使用,编译理论,插件编写
8、如何优化项目:路由得模块化与统一加载;打包骚操作-优化;插件解决项目问题,模块化的理解,require.context自动加载
子路由
总路由
打包优化:dll优化可以把第三方包进行处理
打包速度优化的总结:
1.处理的内容多少,处理步骤多少
2、能少处理就少处理
3、能够减少一些处理步骤
先预处理第三方库-》告诉我们的真正打包不需要处理这些
项目vuex过大,导致打包结果过大,处理:按组件异步拆分
9、优化请求:api文件,request:servicejs
(1)接口api化,(2)请求自动绑定(3)防止重复提交
接口变成api:写一个总文件把所有模块的api文件合并到一起
10、自定义插件库及npm集成
插件可以封装组件,组件暴露 数据给插件
插件主文件
package.json name是插件名字 license:MIT只能用我的,不能改我的,private:false,不是私有的,大家都能用 scripts:{'lib':'vue-cli-service build --target lib --name 插件名字 --dest lib src/plugins/index.js'} main入口文件'main':'lib/插件名字.umd.min.js'
上传到npm官网,在命令行输入npm login 回车 输入用户名和密码,邮箱 npm publish