利用 vue-cli 搭建的项目平台 利用stylus写的css样式 有 css-loader 依赖包x 下图是 webpack.base.conf.js 关于字体文件的配置有人这里会有重复的字体文件的配置，删除一项即可 出现的问题：引入字体图标出现问题 1.报错将字体引入的相对路径改成绝对路径 相对路径绝对路径2.不报错，但是出现的字体图标是小方框 有警告信息：小方块：报错是因为重定向的问题 出现上述问题的原因 ①没在用到的地方引入字体的样式文件 ②使用的是后缀...
警告 1.出现这个警告问题的时候 我们可以去main.js中在头部添加这句话： Vue.config.productionTip = false这样即可去除警告！ 2.在build文件下的webpack.base.conf.js文件中， 将 ...(config.dev.useEslint ? [createLintingRule()] : []),注释掉， const createLintingRule = () => ({ test: /\.(js|vue)$/, loader: eslint-loader, enforce: pre, include: [resolve(src), resolve(test)], options: { formatter: require(e...
传统方式中，许多人使用本地存储，来管理通过客户端验证生成的tokens。一个大问题是如何有更好的方式，来管理验证tokens，从而允许我们来存储更大的用户信息。 这就是Vuex的作用。 Vuex为Vue.js应用管理状态.。对于应用中所有的组件来说，它被当做中央存储，并用规则确保状态只能以可预见的方式改变。 对于经常检查本地存储来说，听起来是个更好的选择？让我们一起来探索下吧。 建立应用模块 对于这个项目，我们想创建一个使用vuex...
原因： css-loader后面带了参数modules(打包报错) url-loader后面带了参数name(引入报错) {test: /\.css$/,use: ExtractTextPlugin.extract({fallback: "style-loader",use: "css-loader?modules!postcss-loader"}) }, {test: /\.(svg|ttf|eot|woff)\??.*$/,loader: "url-loader?limit=10000&name=fonts/[name].[ext]" }解决方案：去掉参数 {test: /\.css$/,use: ExtractTextPlugin.extract({fallback: "style-loader",use: "css-l...
问题 vue-cli npm run build命令默认把dependencies中的依赖统一打包，导致vendor.js文件过大，出现首屏加载过于缓慢的问题。 解决方案 像vue、axios、element-ui这些基本上不会改变的依赖我们可以把它们用cdn导入，没有必要打包到vendor.js中。 1.在项目根目录index.html使用cdn节点导入 <div id="app"></div> <!-- 先引入 Vue --> <!--开发环境--> <script src="https://cdn.bootcss.com/vue/2.5.3/vue.js"></script> <!--生产环...
Vue使用swiper插件时特别是轮播元素含有动态数据时可能会出现数据为空或者白屏的问题 使用下面的方法可以解决（保证在数据请求之后再渲染页面） 页面结构 <div class="swiper-container"><div class="swiper-wrapper"><div class="swiper-slide tpOne" v-if="topInfo"><-- 此处为绑定数据的轮播元素 --><div class="bannerBox1"><div class="l_label" >{{topInfo.label}}</div><div class="l_title" >{{topInfo.title}}</div><div ...
最近在尝试用nuxtjs来搭建新的站点，但是平时在jquery里面用惯的一些插件一到vue上面引用就各种不顺畅~本文记录一下在用Swiper插件来做轮播图的时候遇到的问题~至于怎么在vue里面引用插件就不累赘了，npm能告诉你~ Swiper的分页器是靠mounted()挂载到Vue组件上而不是直接写在template里，所以在style scoped中写的样式无法作用到分页器的点上。解决办法是把重写的样式写在scoped之外。(以下截图不完整，仅用做说明) template：scri...
前几天在工作的过程中，在数据渲染的时候，发生了swiper那一部分的轮播图不在滚动，手动滑动也没有效果。一直感觉数据开始渲染，是不是数据渲染的时候，并没有生成swiper的节点呢。后来第一感觉就是把控制swiper轮播的函数放在初始化事件中去，放在初始化事件中去：结果并没有达到自己的理想状况，后来放在数据获取之后哪里在进行轮播事件的发生，swiper终于可以滑动了。其实这也不能算是一个什么大的问题点，只是单纯的想记录一下...
实际在vue中 this.A = this.B,没有进行深层赋值，只是把this.A的地址指向了与this.B相同的地址，所有对于A的修改会影响到B。 解决相互影响的思路是在this.A必须是新建的一个对象，这样才能保证不被指向同一地址，属性修改不会相互影响。 解决方式： this.A=JSON.parse(JSON.stringify(this.B));将对象转成字符串剔除对象属性后,再转换成对象赋值，这样能解决指向相同地址修改会相互影响的问题。 以上这篇解决vue A对象赋值给B对象,...
我的代码之前类似下面的结构 <div id="example-1" v-for="item in items"><ul><li>{{ item.message }}</li></ul> </div>结果发现不好用，数据读入了但是没有显示 于是我后来看官网的例子才明白，原来是id和v-for不在一个层级上，官网的例子如下，我按照不在一个层级上改，果然好用了 <ul id="example-1"><li v-for="item in items">{{ item.message }}</li> </ul>以上这篇Vue中的v-for指令不起效果的解决方法就是小编分享给大家的...
1.先写一个图片加载的方法 class ImgLoadClass {static preloadImages = (arr) => {//已经加载完的图片数量let loadeImage = 0//存放图片的数组let newImages = []//处理存入字符串，取得src部分//let arr = str.match(/src="(.+)"\s{1}/g)//返回一个promise对像return new Promise((resolve,reject)=>{for (let i=0;i < arr.length;i++){for(let i = 0; i < arr.length; i++){newImages[i] = new Image()//设置图片src属性//newIm...
1、修改config/index.js2、修改路由route/index3、后台配置nginx以上这篇解决vue项目nginx部署到非根目录下刷新空白的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
大家会遇到打包后文件很大，导致页面初始化加载的速度很慢。会出现白屏的现象。这一般是你打包的vendor太大的缘故。如果你打包后看到你的vendor文件有700kb以上。你就要考虑怎么处理。 处理这种文件的 1、把不常改变的库放到index.html中，通过cdn引入，比如下面这样：<script src="https://unpkg.com/vue@2.5.2/dist/vue.js"></script><script src="https://unpkg.com/vue-router@3.0.1/dist/vue-router.js"></script><script src...
在项目开发过程中，让人抓狂之一的问题就是一个点击事件，当快速点击的时候，它会重复发送多个请求。这是不允许出现的。 但是怎么解决这个问题呢？ 一般处理方法，就是点击的时候，立刻将该按钮disabled，这样就可以避免重复发送请求了。但是我发现这个有一个弊端，那就是： 如果，该事件有许多的验证，比如电话、邮箱格式是否正确呀，必填的是否填了呀等等。一旦你点击就把按钮disabled了，发现该填的没填，回去填完后发现按钮不能...
vue +webpack 项目中数据更新后页面没有刷新问题，ie11下，如果GET请求请求相同的URL，默认会使用之前请求来的缓存数据，而不会去请求接口获取最新数据，我用的解决方法是在每个请求发送前，拦截请求并给请求接口的URL后加一个时间戳(new Date().getTime()),这样就保证了每一次请求的URL都不同，ie11就会不断的请求接口而不使用缓存数据。 代码如下if(config.url.indexOf(?)>-1){config.url = url + config.url +"×tamp="+get...