vue 开发常见问题解决大全

vue添加favicon.ico,包含开发环境和生产环境显示。


 1、把图标放在下项目的根目录.。

2、修改build文件夹下面的webpack.dev.conf.js(开发环境) 和webpack.prod.conf.js(生产环境)。添加代码如下:

favicon: path.resolve('favicon.ico'),

webpack.dev.conf.js(开发环境):

 webpack.prod.conf.js(生产环境):

 3、修改完成之后,然后重新启动,记住每次修改完配置,都要重新启动,后面不再重复描述。

vue打包产生多余的.map文件。


 1、修改config文件夹下的index.js文件,把productionSourceMap: false,设置为false。

 

 去除url的#号


 1、在router文件夹里面的index.js里面添加

mode: 'history'

路由懒加载


1、修改router文件夹里面的index.js,删除原来的引入文件的方式,改成

routes: [
    {
      path: '/',
      name: 'index',
      component: resolve=>(require(["@/components/index"],resolve))
    }
  ]

 使用less


 1、安装依赖包。

npm install less less-loader --save-dev

2、然后在vue文件中使用,lang="less"和@import。

 手机局域网允许访问项目


1、修改config文件夹里面的index.js文件,把里面的host’:'localhost'修改为:host: '自己的ip地址'。

 然后重启项目,即可通过ip访问到项目。

keep-alive使用


场景:

列表页面,详情页面,编辑页面,三页面之间交互之后数据缓存。

1、路由配置文件index.js

 2、App.vue

 3.列表页面

 4、编辑页面

 5、详情页面

 我这个是比较全面的仔细的,最后把这些方法提到公共方法里面操作。这里不做介绍了。

上面就是一些较为常用并且实用的vue问题。具体的每个修改文件,我已经传了项目到码云上面,并且在里面做了tag标记,大家可以进去查看全部代码。

码云本项目地址:https://gitee.com/xiaoqiuxiong/vue_study

觉得对自己有用的,望各位基友点个赞赞赞!!!!!!!

猜你喜欢

转载自www.cnblogs.com/it-xiong/p/vue.html