前端学习（四）基本知识

1、const/var/lef基本概念
const声明一个只读的常量。一旦声明，常量的值就不能改变；es6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。；var是全局可用，不一定在声明作用域，存在覆盖问题。
2、默认导入、按需导入、直接导入
默认导入，一个被导入文件只能声明一个export default，调用方导入时可以直接命名导入名字，名字只要合法即可，因为默认是唯一的没有限制，这种必须被调用方声明，调用方再导入；按需导入，导入时调用方需要在导入命名必须为被调用方文件同样的名字因为这个不唯一，而且需要加上{} ，对被调用方来说可以有多个export 而不是像export default只有一个；直接导入：直接导入会直接运行被调用方的全部js内代码，导入时不用起名字，直接import xx.js（按实际路径写）
3、在webpack 中，默认只能处理 一部分 ES6 的新语法，一些更高级的ES6语法或者 ES7 语法，webpack 是处理不了的；通过 Babel ，可以帮我们将 高级的语法转换为 低级的语法，让webpack帮我们打包管理文件。
4、为什么每次写完代码要npm run dev 这个其实是将项目重新编译打包（webpack+bable配合解析高级语法为低级浏览器可识别的语法，打包模式分为development与production，打包完被放置到与src并列的一个dist文件夹下的main.js文件中，第一种不会压缩文件格式比较规整，生产模式会将文件格式进行各种缩进调整，尽量减少空间，比如很多不必要的空格全部去掉，但不影响浏览器识别。开发阶段用development编译快不用再进行压缩。）
5、打包默认入口文件为src下的index.js文件默认输入为与src并列的dist文件夹下的main.js文件。如果想修改，需要在webpack.config.js进行配置，

6、html-webpack-plugin 依赖帮助我们项目启动后声明的ip:port直接映射到首页。
7、打包后直接打开网页。
8、loader，webpack默认只能打包.js文件，其他的文件需要loader协助进行打包，比如应对对应类型文件分别有：less-loader,scss-loader,url-loader等;less,sass,scss基本都是对css的功能扩展都是为了方便开发css样式，最后也会被解析成css来进行浏览器加载解析。postcss解决快速配置浏览器兼容性问题。
9、vue单文件组件：后缀名为.vue；组件由三部分组成：template组件的模板区域（html骨架区）、script组件的逻辑区域（js逻辑区）、style组件的样式区域（css样式区）。使用时候直import  name from ./abc.vue  注意webpack需要安装vue-loader加载器辅助解析包含vue-loader vue-template-compiler

10、webpack中使用vue

11、vue脚手架项目结构分析