从0搭建vue项目笔记1

项目背景：公司要开新的项目，决定使用现在流行的vue搭建前端的框架。我之前写过一些vue.js的代码，还没有使用构建工具搭建过vue项目，所以记录一下搭建的过程。

1 关于style标签中的scoped

scoped属性，当 style标签有 scoped 属性时，它的 CSS 只作用于当前组件中的元素。如果不加这个属性，写在style标签中的样式就是全局样式了，当然这两种是可以同时存在的。在https://vue-loader-v14.vuejs.org/zh-cn/features/scoped-css.html这个网页中有更加详细的解释。

2 关于屏幕高度的计算

在做框架页面的时候需要计算页面高度使得菜单内容和组件内容充满屏幕。有两种方法，可以使用js计算页面高度，从而进行控制。也可以使用css的calc()进行计算。要注意vw是宽度单位，100vw就是100%宽，vh是高度单位，100vh就是100%高。括号中的计算支持加减乘除，但是注意要在运算符号前后使用空格，否则不管用。如

<div style="width: calc(100vw - 10px)"> 

宽度：100%-10px的意思