import defaultcomponent,{a,b,c...} from 'XXX'
eg: import React,{Component} from 'react';
导入‘react’文件里export的一个默认的组件，将其命名为React以及Component这个非默认组件
import defaultcomponent form 'XXX'
导入XXX文件中的默认组件，命名为defaultcomponent
import {a} from 'XXX'
导入XXX文件中的a组件
import {a as b} from 'XXX'
导入XXX文件中的a组件，并将其重命名为b
import * as a from 'XXX'
导入XXX文件中的所有组件，并将其命名为a，调用具体组件的方式为a.b、a.c。。。但不包含默认组件

如果是默认导出, 则import后面的命名可以随意取, 国为总会解析到export default.

@import后的～的意思

    @import "~bootstrap/dist/css/bootstrap.min.css";
    @import "~font-awesome/css/font-awesome.min.css";

前面加 ~ 表示你后面的值为 alias, 然后就会去 webpack alias 配置中找相应的值, 然后拼接成最后的地址, 例如

    resolve: {
        alias: {
            "bootstrap": "xxx/xxx2",
            "font-awesome": "yyy/yyy2",
        }
    }