[组件库][构建发布] 组件库开发、前端工程化踩坑

148 阅读2分钟

HTTP

  1. 通过proxyMiddleware代理请求的时候, 发现404, 400的几种情况
    1. 服务器端router配置(404)
    2. proxytable是否少配置了规则(404), 比如数据api为/v1/data, 而登录api为/login, 是否只配置了 /v1 ?
    3. 服务器端(Django)没有允许客户端host访问(400)
  2. http-proxy-middleware 代理 与跨域
  3. http-proxy-middleware 代理实现直接代理服务器端数据, 使用服务器端数据在本地直接测试
  4. API请求的统一错误处理

Webpack

  1. webpack vendor.js 以及处理
  2. webpack编译, 以及对应的babel配置, 理解babel-preset-stage-2到是什么玩意
  3. 了解sourceMap

路由

  1. vue-router keep-alive的配置,以去掉keep-alive才显示的问题
  2. Nginx路径强匹配问题
       注意这里admin括号后面跟了一个/, 这个代表路径强匹配, 也就是(1) aaa.com/admin这样是访问不了的,
       只有aaa.com/admin/这样才可以.
       如果想让(1), 生效, 则需要将admin括号后面的/去掉就OK,
       此外,后端Django可以配置, 进行重定向, 让url后面显示/
    
       location ~* ^/(v1|admin)/ {
             proxy_pass http://127.0.0.1:3000;
        }
    
  3. vue-router路由懒加载的具体场景观察, 和实现原理
  4. NGINX server_name是做什么的? 不添加它, 直接让域名指向该服务器也可以访问. 那这个server_name是做什么的呢?
  5. nginx 针对首页 html 不缓存,其他 js,css 等资源缓存

框架

  1. 总结vuex 和 nexttick的使用场景. 数据量多的情况下如何管理, 组件之间的通信
  2. 看看 Vue.js 打包生成的浏览器 执行的代码(dist/vue.js)里面 common.js 或者 任何其他代码 代码加载器 相关知识。

构建

  1. webpack打包体积为何需要优化? => 当多个项目公用很多组件的时候, 需要将代码抽象为组件的形式, 以npm包发布. 这样, 代码就可以实现复用. 但是当做组件体积
  2. 每一个页面的样式,scss变量如何统一定义在一个文件中?或者说统一定义在一个文件中是否有意义
  3. umd, amd 各种模块化规范和模块化在浏览器端的区别
  4. manifest.js 这个是用来做什么的?
  5. Babel 用户手册