vue + element初始化项目--代码初始化

1.清除App.vue和 router文件夹下index.js的无用代码

2.安装less依赖 

注意less-loader  10.0.1版本会报错

建议版本

 　　"less": "^4.1.1",

　　 "less-loader": "4.1.0"

 

3.新建全局css文件

 初始化样式

/* 全局样式 */
html,
body,
#app {
  height: 100%;
  margin: 0;
  padding: 0;
}

main.js导入全局css 

　　import './assets/css/global.css'

 

4.导入图标库

使用element官网中图图标这不用此操作

1. 在阿里图库中下载的fonts文件夹放在assets目录下

2. 在main.js中导入

　　//导入图标库

　　import './assets/fonts/iconfont.css'

 

5.根目录下新建 .prettierrc 文件 

    文件内容格式为json , 用来规定  格式化代码风格, 　

    可以通过修改该文件 ,自定义代码格式,  避免格式化工具和eslint之间产生冲突

例如: 

{
    // tab缩进大小,默认为2
    "tabWidth": 4,
    // 使用tab缩进，默认false
    "useTabs": false,
    // 使用分号, 默认true
    "semi": false,
    // 使用单引号, 默认false(在jsx中配置无效, 默认都是双引号)
    "singleQuote": false,
    // 行尾逗号,默认none,可选 none|es5|all
    // es5 包括es5中的数组、对象
    // all 包括函数对象等所有可选
    "TrailingCooma": "all",
    // 对象中的空格 默认true
    // true: { foo: bar }
    // false: {foo: bar}
    "bracketSpacing": true,
    // JSX标签闭合位置 默认false
    // false: <div
    //          className=""
    //          style={{}}
    //       >
    // true: <div
    //          className=""
    //          style={{}} >
    "jsxBracketSameLine": false,
    // 箭头函数参数括号 默认avoid 可选 avoid| always
    // avoid 能省略括号的时候就省略 例如x => x
    // always 总是有括号
    "arrowParens": "avoid"
}

另一篇文章:  .PRETTIERRC代码格式化配置介绍