1. 创建项目

1. 使用 vue create super_mall在命令行创建一个vue项目。

2. 划分目录结构

项目主要的目录结构

3. 引入并初始化样式

1. 使用 normalize.css进行初始化, normalize.css的githup地址。

2. 创建一个base.css，在其中引入 normalize.css。

3. 在 App.vue中引入base.css。

/* 引入基础的 css */
  @import './assets/css/base.css';

4. 为路径起别名

4.1 在 VueVLI3以后如何为路径起别名？

1. 在项目中创建一个vue.comfig.js的文件，进行配置，该文件的内容会覆盖原来的配置。

module.exports = {
  configureWebpack: {
    resolve:{
      /* 配置别名 */
      alias:{
        /* 默认配置 @ 对应 src 路径 */
        'assets':'@/assets',
        'common':'@/common',
        'components':'@/components',
        'network':'@/network',
        'views':'@/views'
      }
    }
  }
}

4.2 代码编写规范配置

1. 项目中有个 .editorconfig的文件用于规范代码的编辑:

[*.{js,jsx,ts,tsx,vue}]
indent_style = space
indent_size = 2
trim_trailing_whitespace = true
insert_final_newline = true
end_of_line = lf