【小白学系列】开发BUG收集

158 阅读2分钟

1. Vue项目index.html动态设置meta标签

vue.config.js
chainWebpack: config => {
    if (process.env.NODE_ENV == 'production') {
        config.plugin('html').tap(args => {
            args[0].csrf =
                '<meta name="_csrf" content="${(_csrf.token)!}"/><meta name="_csrf_header" content="X-CSRF-TOKEN"/>';
            return args;
        });
    }
},

需要注意:如果为了修改title名,添加了以下配置项:

pages: {
    index: {
        entry: "./src/main.js",
        title: "千里眼自助服务门户后台管理系统"
    }
},

那么两段代码会有冲突,报如下错误,请酌情选择解决。

2.Vscode安装prettier插件格式化无效

vscode同时安装了Prettire和vetur,当前暂时没有选中默认的格式化插件,右击当前文件-->格式化文件:选中其中一个即可

3.负margin的理解

CSS权威指南上提过:无论你margin、padding怎么变,最终都要等于父元素的宽高、比如父元素300px,子元素撑满父元素也是300px,此时子元素设置margin-left:-100px,因为子元素总宽度要等于父元素300px,此时子元素只有变为400px,才能等于父元素宽度。

4.linear-gradient()

1.前者小于后者(上:red 20%, orange 50%)
  理解:背景色的前20%的位置都是红色的实体色,在50%以后都是橘色的实体颜色,只有20%~50%之间才是渐变色
  结论:渐变过渡区的占比总的空间(高度或者宽度)减去上下两个色块空间占比剩下的空间。
2.前者大于后者(下:red 50%, orange 40%)
  结论:如果某个色标的位置值比整个列表中在它之前的色标的位置值都要小,则该色标的位置值会被设置为它前面所有色标位置值得最大值