vue中使用icon-font阿里巴巴,css中object-fit属性介绍,post请求头类型设置为multipart/formData,出现WebKitFo

55 阅读1分钟

1.vue-cli3.0中的process.env.NODE_ENV

使用vue-cli3构建的项目就简单多了,因为vue-cli3使用上述的DefinePlugin方式帮你把process.env.NODE_ENV配置好了,我们不需要再自己去配置。
它自带了三种模式:

development:在vue-cli-service serve下,即开发环境使用
production:在vue-cli-service build和vue-cli-service test:e2e下,即正式环境使用
test: 在vue-cli-service test:unit下使用

在package.json中的scripts命令如下:

{
  "name": "",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "vue-cli-service serve", //本地开发运行,会把process.env.NODE_ENV设置为'development'
    "build": "vue-cli-service build", //默认打包模式,会把process.env.NODE_ENV设置为'production'
  },
  "dependencies": {
  }
}

2.vue中使用icon-font阿里巴巴

1.将选择的图标添加进对应的项目,下载压缩包至本地

1678948308429.png

2.在项目assets文件中新建iconfont目录,讲解压好的几个文件引入项目中

1678948383607.png

1678948418992.png 3.在main.js文件中讲对应的.css文件引入

1678948436494.png 4.在代码中就可以通过fontclass的方式直接使用了

1678948598597.png

3.阿里播放器中的video标签无法占满整个容器

解决:直接给video加上object-fit: fill;即可

object-fit属性介绍

object-fit 属性指定元素的内容应该如何去适应指定容器的高度与宽度。

object-fit 一般用于 img 和 video 标签,一般可以对这些元素进行保留原始比例的剪切、缩放或者直接进行拉伸等。

1679298085252.jpg

4.post请求头类型设置为multipart/formData,出现WebKitFormBoundaryk...的解决办法

解决:写成:contentType: 'application/json;charset=UTF-8'就可以了