1. npm i -g @vue/cli typescript –安装vue-cli脚手架和typescript

  2. vue create <Project Name> –创建项目
    如果是在windows下使用git bash,需要在此基础上修改.bashrc:

    1
    2
    3
    vim ~/.bashrc
    然后将 alias vue='winpty vue.cmd' 粘贴进去
    之后重启git bash
  3. 选择手动选择,然后选择Babel,typescript,Router,Vuex,CSS Pre-processors,Linter。

    1
    2
    3
    4
    5
    6
    Babel
    TypeScript
    Router
    Vuex
    CSS Pre-processors
    Linter
  4. 推荐使用webstorm或vscode进行开发,其中webstorm需要安装ESlint+Prettier+Typescript+Vue共4个插件

  5. 配置ESlint和Prettier

    在工程的根目录下创建.prettierrc.js文件,并加上以下配置

    1
    2
    3
    4
    module.exports={
    singleQuote: true,
    semi: false
    }

    修改工程根目录下的.eslintrc.js文件,增加下图中红框中的代码

    检验是否配置成功:打开src/main.tx

    ​ 可以看到,双引号字符和句尾的分号都报错了,这时只需要按Alt-Shift-Ctrl-p,就可以自动修正所有报错了。