开始项目前

先在cmd或者git运行node -v和npm -v确认node和npm已安装并确认版本较新

安装vue-cli(vue脚手架)

国内使用npm速度慢的话,可以使用
npm install -g cnpm --registry=https://registry.npm.taobao.org
安装淘宝镜像,之后只要使用cnpm就可以了

然后安装vue-clicnpm install -g vue-cli

安装完成后运行vue -h来确认已经成功安装

初始化webpack项目模板

输入vue init webpack初始化webpack项目模板,离线环境使用vue init webpack --offline初始化
然后会提示输入项目名字不能使用中文名

这里使用mall作为名字,接下来是项目描述,可以使用中文

然后是Author(作者),本文这里是默认使用github账号作为作者的

image.png

然后是选择vue bulid(生产环境),可以根据需要选择,第一项是运行环境+编译器,第二项是只有编译器,大多数项目都可使用第一项,第二项的好处就是只有6kb,并且只能用vue文件来编写

然后会问你要不要安装router路由，这个必须装，除非使用第三方路由

后面会依次出现
是否使用ESLint、是否安装党员测试是否安装e2e tests，可以根据需要安装，本文这里都安装

最后会问你要不要安装依赖包，国内网速慢的小伙伴可以不安装，回头用cnpm安装，本文用cnpm安装就不使用npm安装了，接下来使用cnpm安装cnpm install

自此,vue项目和npm依赖包安装完毕

配置eslint

ESLint是可组装的JavaScript和JSX检查工具,使得代码编写必须符合锁规定的代码规范才能通过编译,可以帮助我们更好的规范团队开发的代码,便于维护,有关eslint的详细规则可以参考https://cn.eslint.org/docs/rules/

这里只贴出本人的配置:

rules: {
    // allow async-await
    'generator-star-spacing': 'off',
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'semi': ['error','always'],
    'indent': 'off',
    'vue/script-indent': ['error', 2, {'baseIndent': 1}],
    'space-before-function-paren': ['error', {'anonymous': 'always', 'named': 'never', 'asyncArrow': 'always'}]
  }
}