web前端学习/工作笔记(一)

记录一下2019年web前端学习工作的笔记,markdown语法格式的,有些渲染效果不是很好, 笔记内容包括:

• vue学习资料、笔记
• 一些重要/细节的知识点
• 前端开发过程中遇到的问题及解决方案

1. 前端工作需要技术点

• W3c http://www.w3school.com.cn/
• html、html5、css、css3、javascript 重点
• http://es6.ruanyifeng.com/ 重点
• Vue https://cn.vuejs.org/v2/guide/ 重点
• Vue-router https://router.vuejs.org/zh/ 了解
• Vuex https://vuex.vuejs.org/zh/guide/ 了解
• Webpack https://www.webpackjs.com/ 了解

1. Vue项目是用脚手架安装的，所以安装的流程和安装后的文件结构和每部分功能要了解；自己安装试试，安装流程就是ppt里的那个；es6的语法什么的也可以在自己安装的项目里实践 Vue-cli创建vue项目以及配置文件梳理 https://segmentfault.com/a/1190000010659925
2. [前端指南] 说:前端必看的100本PDF电子书，链接: https://pan.baidu.com/s/18NfCaKCC9cVEv4S6J80Mfg 提取码: gte3
3. Vue培训 / 学习路线（尤雨溪）： 新手向的学 习 路 线 https://zhuanlan.zhihu.com/p/23134551

• 已有前端基础的学习路线
  • 通过文档基础部分上手
  • 通过实战类的视频课程或是书籍深化理解
  • 再过一遍文档，这一遍着重看细节
  • 在中小型项目中继续熟悉
  • 阅读一些开源组件代码，了解一些高级用法
  • 阅读深入内部实现、源码研究类的书籍
  • 推荐两本电子书：Vue 技术内幕 Vue.js 技术揭秘

1. vue环境安装：

• cmd停止操作: CTRL+C+C
• 安装当前目录的依赖：cnpm i
• 会安装package.json下的依赖，我们平常安装的插件* 版本号都在package.json里有配置

1. WebStorm破解:

• 2RRJMBXW33-eyJsaWNlbnNlSWQiOiIyUlJKTUJYVzMzIiwibGljZW5zZWVOYW1lIjoi5b285bK4IHNvZnR3YXJlMiIsImFzc2lnbmVlTmFtZSI6IiIsImFzc2lnbmVlRW1haWwiOiIiLCJsaWNlbnNlUmVzdHJpY3Rpb24iOiJGb3IgZWR1Y2F0aW9uYWwgdXNlIG9ubHkiLCJjaGVja0NvbmN1cnJlbnRVc2UiOmZhbHNlLCJwcm9kdWN0cyI6W3siY29kZSI6IklJIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In0seyJjb2RlIjoiUlMwIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In0seyJjb2RlIjoiV1MiLCJwYWlkVXBUbyI6IjIwMTktMDctMDcifSx7ImNvZGUiOiJSRCIsInBhaWRVcFRvIjoiMjAxOS0wNy0wNyJ9LHsiY29kZSI6IlJDIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In0seyJjb2RlIjoiREMiLCJwYWlkVXBUbyI6IjIwMTktMDctMDcifSx7ImNvZGUiOiJEQiIsInBhaWRVcFRvIjoiMjAxOS0wNy0wNyJ9LHsiY29kZSI6IlJNIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In0seyJjb2RlIjoiRE0iLCJwYWlkVXBUbyI6IjIwMTktMDctMDcifSx7ImNvZGUiOiJBQyIsInBhaWRVcFRvIjoiMjAxOS0wNy0wNyJ9LHsiY29kZSI6IkRQTiIsInBhaWRVcFRvIjoiMjAxOS0wNy0wNyJ9LHsiY29kZSI6IkdPIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In0seyJjb2RlIjoiUFMiLCJwYWlkVXBUbyI6IjIwMTktMDctMDcifSx7ImNvZGUiOiJDTCIsInBhaWRVcFRvIjoiMjAxOS0wNy0wNyJ9LHsiY29kZSI6IlBDIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In0seyJjb2RlIjoiUlNVIiwicGFpZFVwVG8iOiIyMDE5LTA3LTA3In1dLCJoYXNoIjoiOTUyNzQwMS8wIiwiZ3JhY2VQZXJpb2REYXlzIjowLCJhdXRvUHJvbG9uZ2F0ZWQiOmZhbHNlLCJpc0F1dG9Qcm9sb25nYXRlZCI6ZmFsc2V9-WBR8xuiXaXLeV0obFYbBfUUQ02r54Vj3fE9ImtuXKSP+NuvvnR6lH6gWcVm9PZt67eqdDZa+Deej1NsoGRPDZS5UB6WEt4YVahlOhmG3rgvXPlP98hsfgFUcjr3OQVY7wk5slJ+Q2G9lkpsqwezO+SFIk9yA6pjxyT+U7FjpU8SY5ilsHskq4FG8FoKPYLsfsuwtXrJimRBxVcDClw/QsnCSwgtjuunc8Te37rHb08ZAxtJJieIsjhWnnzrQ3LmxmsR4xstkZOSqD4bYgeNz+m2nbmCWJ5lfP+pnqWfSsUCVri2TUxTpzzTMe4Cx8UhGeJgIgUyBXjq05/0nq3YoVg==-MIIEPjCCAiagAwIBAgIBBTANBgkqhkiG9w0BAQsFADAYMRYwFAYDVQQDDA1KZXRQcm9maWxlIENBMB4XDTE1MTEwMjA4MjE0OFoXDTE4MTEwMTA4MjE0OFowETEPMA0GA1UEAwwGcHJvZDN5MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxcQkq+zdxlR2mmRYBPzGbUNdMN6OaXiXzxIWtMEkrJMO/5oUfQJbLLuMSMK0QHFmaI37WShyxZcfRCidwXjot4zmNBKnlyHodDij/78TmVqFl8nOeD5+07B8VEaIu7c3E1N+e1doC6wht4I4+IEmtsPAdoaj5WCQVQbrI8KeT8M9VcBIWX7fD0fhexfg3ZRt0xqwMcXGNp3DdJHiO0rCdU+Itv7EmtnSVq9jBG1usMSFvMowR25mju2JcPFp1+I4ZI+FqgR8gyG8oiNDyNEoAbsR3lOpI7grUYSvkB/xVy/VoklPCK2h0f0GJxFjnye8NT1PAywoyl7RmiAVRE/EKwIDAQABo4GZMIGWMAkGA1UdEwQCMAAwHQYDVR0OBBYEFGEpG9oZGcfLMGNBkY7SgHiMGgTcMEgGA1UdIwRBMD+AFKOetkhnQhI2Qb1t4Lm0oFKLl/GzoRykGjAYMRYwFAYDVQQDDA1KZXRQcm9maWxlIENBggkA0myxg7KDeeEwEwYDVR0lBAwwCgYIKwYBBQUHAwEwCwYDVR0PBAQDAgWgMA0GCSqGSIb3DQEBCwUAA4ICAQC9WZuYgQedSuOc5TOUSrRigMw4/+wuC5EtZBfvdl4HT/8vzMW/oUlIP4YCvA0XKyBaCJ2iX+ZCDKoPfiYXiaSiH+HxAPV6J79vvouxKrWg2XV6ShFtPLP+0gPdGq3x9R3+kJbmAm8w+FOdlWqAfJrLvpzMGNeDU14YGXiZ9bVzmIQbwrBA+c/F4tlK/DV07dsNExihqFoibnqDiVNTGombaU2dDup2gwKdL81ua8EIcGNExHe82kjF4zwfadHk3bQVvbfdAwxcDy4xBjs3L4raPLU3yenSzr/OEur1+jfOxnQSmEcMXKXgrAQ9U55gwjcOFKrgOxEdek/Sk1VfOjvS+nuM4eyEruFMfaZHzoQiuw4IqgGc45ohFH0UUyjYcuFxxDSU9lMCv8qdHKm+wnPRb0l9l5vXsCBDuhAGYD6ss+Ga+aDY6f/qXZuUCEUOH3QUNbbCUlviSz6+GiRnt1kA9N2Qachl+2yBfaqUqr8h7Z2gsx5LcIf5kYNsqJ0GavXTVyWh7PYiKX4bs354ZQLUwwa/cG++2+wNWP+HtBhVxMRNTdVhSm38AknZlD+PTAsWGu9GyLmhti2EnVwGybSD2Dxmhxk3IPCkhKAK+pl0eWYGZWG3tJ9mZ7SowcXLWDFAk0lRJnKGFMTggrWjV8GYpw5bq23VmIqqDLgkNzuoog==
• 运行后自动打开浏览器：config->index.js->autoOpenBrowser=true

1. WebStorm汉化及样式 https://blog.csdn.net/qq_33915006/article/details/79696319， 汉化包里面的jar包，放在lib目录下即可
2. WebStrom快捷键：选择VS Ctrl+/ 注释/取消 Ctrl +’.’ 折叠选中代码
3. Vue简写: v-bind:message -> :message v-on:click -> @click
4. vue中引入css:

<style lang="sass"> 
@import "../../css/views/pos.scss"; 
</style

1. H5去掉滚动条:

• ::-webkit-scrollbar{display: none;}