vue添加favicon.ico,包含开发环境和生产环境显示。
1.把图标放在下项目的根目录。
image
2.修改build文件夹下面的webpack.dev.conf.js（开发环境） 和webpack.prod.conf.js（生产环境）。添加代码如下：
favicon: path.resolve('favicon.ico'),
webpack.dev.conf.js（开发环境）：
image
webpack.prod.conf.js（生产环境）：
image
3.修改完成之后，然后重新启动，记住每次修改完配置，都要重新启动，后面不再重复描述。
vue打包产生多余的.map文件。
1.修改config文件夹下的index.js文件，把productionSourceMap: false,设置为false。
image
去除url的#号
1.在router文件夹里面的index.js里面添加
mode: 'history'
路由懒加载
1.修改router文件夹里面的index.js，删除原来的引入文件的方式，改成
routes: [
{
path: '/',
name: 'index',
component: resolve=>(require(["@/components/index"],resolve))
}
]
image
使用less
1.安装依赖包
npm install less less-loader --save-dev
2.然后在vue文件中使用，lang="less"和@import
image
手机局域网允许访问项目
1.修改config文件夹里面的index.js文件，把里面的host’:'localhost'修改为：host: '自己的ip地址'。
image
然后重启项目，即可通过ip访问到项目。
keep-alive使用
场景：
列表页面，详情页面，编辑页面，三页面之间交互之后数据缓存。
1.路由配置文件index.js
image
2.App.vue
image
3.列表页面
image
4.编辑页面
image
5.详情页面
image
我这个是比较全面的仔细的，最后把这些方法提到公共方法里面操作。这里不做介绍了。
上面就是一些较为常用并且实用的vue问题。具体的每个修改文件，我已经传了项目到码云上面，并且在里面做了tag标记，大家可以进去查看全部代码。
码云本项目地址：https://gitee.com/xiaoqiuxiong/vue_study
觉得对自己有用的，望各位基友点个赞赞赞！！！！！！！
网友评论