cli创建vue2和vue3 vue-cli3和2的区别

Vue-cli是一个用于快速搭建Vue项目的脚手架工具，它提供了一套完整的项目结构和配置，方便开发者快速开始Vue项目的开发。Vue-cli3是Vue-cli的升级版本，相较于Vue-cli2，它有以下几个主要的区别。

Vue-cli3采用了新的插件机制。在Vue-cli2中，插件是通过在项目生成过程中执行一些特定的操作来实现的，而Vue-cli3中的插件机制则更加灵活和可扩展。Vue-cli3中的插件是通过一个配置文件vue.config.js来进行配置的，开发者可以在该配置文件中自定义各种构建和开发过程中的行为。下面是一个示例的vue.config.js配置文件：

module.exports = {
  // 自定义配置
  devServer: {
    port: 8080
  },
  // 其他配置...
}

Vue-cli3对项目的配置进行了优化。Vue-cli2中的配置是分散在多个文件中的，而Vue-cli3将所有的配置都集中在一个文件中，更加清晰和易于维护。Vue-cli3中的配置文件是vue.config.js，开发者可以在该文件中进行各种配置，例如自定义Webpack配置、配置代理、配置打包输出路径等。下面是一个示例的vue.config.js配置文件：

module.exports = {
  // 自定义Webpack配置
  configureWebpack: {
    plugins: [
      // 自定义插件
    ]
  },
  // 配置代理
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  },
  // 配置打包输出路径
  outputDir: 'dist',
  // 其他配置...
}

Vue-cli3引入了Vue UI图形化界面。Vue-cli3提供了一个命令vue ui，通过该命令可以启动一个本地的Web服务器，打开浏览器访问该服务器可以进入Vue UI图形化界面。在该界面中，开发者可以通过可视化的方式进行项目管理、插件安装、配置修改等操作，更加方便和直观。下面是一个示例的启动Vue UI界面的命令：

shell

vue ui

Vue-cli3相较于Vue-cli2在插件机制、项目配置和开发体验上都有了一些改进和优化。开发者可以根据自己的需求选择使用Vue-cli2还是Vue-cli3来进行Vue项目的开发。