vue项目打包后css背景图路径不对的问题

问题描述: 自己在自学vue做项目的过程中,遇到一个有关背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常显示的,可使用npm run build命令打包后,访问dist目录下的项目,页面背景图路径就不对了,显示不出背景图。如下两张图对比 图一:使用npm run dev命令访问   图二:使用npm run build命令打包之后,访问dist目录下的文件,出现的问题,背景图片路径变成了http://127.0.0.1:9000/static/css/static/img/login-bg.0271ef1.jpeg,而实际在dist目录下,图片路径是这样的,如下图   解决办法: 解决办法为:只需要在build/utils.js文件中添加如下一行代码即可。

添加位置为如下图:   然后重新执行 npm run build 命令,即可成功显示图片   from:https://www.cnblo […]

npm install --save 、--save-dev 、-D、-S 的区别与NODE_ENV的配置

备注:<=> 意为等价于; 1、npm install <=> npm i --save   <=> -S --save-dev  <=> -D npm run start <=> npm start  // 对应"scripts"里的"start"命令 少敲几下键盘,何乐而不为 2、npm i --save-dev  <packname>   工程构建(开发时、“打包”时)依赖 ;例:xxx-cli , less-loader , babel-loader… 3、npm i --save <packname>  项目(运行时、发布到生产环境时)依赖;例:antd , element,react… 4、对应关系如下(至于我们啥时候用--save、啥时候用--save-dev 感觉是个规范问题,用反了项目一样可以跑起来(对于安装依赖正确时),但会给 […]

vue 安装遇到权限问题 解决

解决方案: npm config set user 0 npm config set unsafe-perm true   报错: Unable to save binary /var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor/linux-x64-64 : { Error: EACCES: permission denied, mkdir '/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor' at Object.mkdirSync (fs.js:753:3) at sync (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/mkdirp/index.js:71:13) at Function.sync (/var/li […]

Vue watch 中 this 注意事项

在watch中使用this要注意,不能用箭头函数,否则会出错,例如:

  箭头函数要改为function的形式,如下:

    from:https://blog.csdn.net/liubangbo/article/details/115242420

html直接引用vue和element-ui的方法

代码如下所示:

效果如图: 总结 到此这篇关于html直接引用vue和element-ui的方法的文章就介绍到这了,更多相关html引用vue和element-ui内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!   from:https://www.jb51.net/web/743299.html

说说 vue 父子组件加载顺序

面试提问:说说 vue 父子组件加载顺序 这我知道答案 父 beforeCreate 父 created 父 beforeMount 子 beforeCreate 子 created 子 beforeMount 子 mounted 父 mounted 子组件若有 props 的话更新顺序是四步,若无的话两步不触发父亲的钩子。 父 beforeUpdate 子 beforeUpdate 子 updated 父 updated 父组件更新顺序是 父 beforeUpdate 子 deactivated 父 updated 销毁过程是 父 beforeDestroy 子 beforeDestroy 子 destroyed 父 destroyed 再问,如果有多个子组件呢?我不太能确定。 加载多个子元素 回头写了一个简单的vue视图,父调用子,以下代码复制可用。

  控制台打印结果如下

  能得出结论,第一个子元素在 beforeMount 后 […]

npm ERR! Unexpected end of JSON input while parsing near

You are trying to create a new angular, react, vue app, and you end up with an error message saying: npm ERR! Unexpected end of JSON input while parsing near There’s a high chance that your npm cache been damaged. Try:

  If you are a windows user, try deleting all files in this folder:

  Then…

  If that doesn’t work, try updating to the lastest (understand the risks […]

Vue 魔法师 —— 将 API “类化”

前言 【类】和【接口】是 JavaScript 未来的方向,我们的 API 调用也将如此,朝着这个方向和业务模块同步分类、同步升级。本文讲的正是 —— Vue 魔法师,如何将 API “类化”? 万物皆模块,万物可归类。闲言少叙,直接正题。 分类 API 环境: Vue2+ 或 Vue3+ 咱这里直接 VueCLI 迅速快捷构建

得到如下目录

  然后新建文件 api.js 如下,

  基础类 API 我们先创建一个基础类如下:

  baseUrl:设置请求根路径; resource:来源; getUrl:获取链接函数,包含 baseUrl、resource、id; handleErrors:处理错误函数; 只读类 API 然后,我们再创建一个子类:包含 fetch、get 只读方法。 [cray […]