vue开发过程问题汇总记录

vue中static文件夹与assets文件夹区别

简单的讲，static放别人家的，assets放自己写的。不知道这个解释是否OK，这里有一篇资料参考。

favicon显示不出来

<link rel="icon" href="assets/logo.png" type="image/x-icon"/>

index.html添加favicon后，显示不出来。调整href的路径，也是显示不不了。
在网上找到两个方法：
（1）使用static目录
将favicon图片放在static目录下

// 经测试，开发环境和生产环境都OK
<link rel="icon" href="static/logo.png" type="image/x-icon"/>

（2）配置webpack
不用在index.html中添加link标签，修改webpack的HtmlWebpackPlugin，添加配置项：

favicon: 'logo.png'

我这里为了简单，直接复制的logo.png到src同级目录下。正式的应该是一个favicon.ico图标。

vue-devtools安装和使用

（1）clone vue-devtools
克隆的https链接为https://github.com/vuejs/vue-devtools
（2）npm install
在工具目录下安装依赖。
（3）npm run build
打包构建工具。
（4）chrome添加扩展程序
将shells>chrome目录直接拖到扩展程序中。
（5）在工具目录下运行npm run dev
（6）在chrome调试vue项目时，打开开发者工具，有一项Vue的插件，即可用来调试Vue，非常方便。

vue中怎么使用scss语法

首先，安装node-sass和sass-loader。

npm install node-sass --save-dev
npm install sass-loader --save-dev

然后，在vue文件中给style标签加上lang属性。

<style lang="scss">

vue-loader支持css预处理器，因此不需要额外写sass的loader了，所以我前面安装的sass-loader可能是多余的。

Updating…