Vue CLI 是一个官方提供的快速创建Vue.js项目的脚手架工具。它可以帮助我们轻松地搭建现代化的Vue.js项目，并且内置了很多有用的功能和插件，让开发过程更加便捷和高效。
1. 安装Vue CLI
首先，我们需要安装Vue CLI。使用以下命令在全局环境下安装Vue CLI：
npm install -g @vue/cli
安装完成后，我们可以使用以下命令检查Vue CLI的版本：
vue --version
确保已经安装了最新版本的Vue CLI。
2. 创建Vue项目
创建一个新的Vue项目非常简单。只需要执行以下命令：
vue create my-project
这里的my-project是项目的名称，你可以根据自己的需求来命名。执行该命令后，Vue CLI会提示你选择一些配置选项。
你可以选择默认的配置，也可以根据自己的需求进行自定义配置。Vue CLI提供了多种预设配置供你选择，例如基本配置、手动配置、TypeScript配置等。选择完毕后，Vue CLI会自动下载所需的依赖，并为你创建一个项目。
3. 项目结构
创建完成后，项目目录结构如下：
my-project
├── node_modules
├── public
│ ├── favicon.ico
│ └── index.html
├── src
│ ├── assets
│ ├── components
│ ├── App.vue
│ └── main.js
├── .gitignore
├── babel.config.js
├── package.json
└── README.md
node_modules：项目依赖的模块public：静态资源目录，包含index.html和其他可供直接访问的资源文件src：源代码目录，包含组件、静态资源和入口文件.gitignore：Git忽略配置文件babel.config.js：Babel配置文件package.json：项目的配置和依赖信息README.md：项目的说明文档
4. 运行项目
在项目根目录下执行以下命令，即可启动项目：
npm run serve
该命令会自动构建并启动项目，然后你就可以在浏览器中访问项目了。
5. 开始开发
Vue CLI创建的默认项目已经为我们做好了一些配置，可以立即进行开发。在src目录下，components目录是用来存放Vue组件的，assets目录是用来存放静态资源的。
我们可以创建新的Vue组件并在App.vue中引入和使用。在组件中可以编写HTML模板、CSS样式和JavaScript逻辑。
6. 构建项目
当你完成了开发并准备上线时，可以执行以下命令构建项目：
npm run build
该命令会在项目根目录生成一个dist目录，其中包含了构建后的文件。你可以将这些文件部署到服务器上以供访问。
7. 其他功能
除了上述基本功能，Vue CLI还提供了其他一些有用的功能和插件。例如，你可以通过Vue CLI添加路由功能和状态管理功能，可以使用Vue CLI插件添加UI框架、代码风格校验、单元测试等。
总结：使用Vue CLI创建Vue项目，我们可以快速搭建现代化的Vue.js项目，并且利用其丰富的功能和插件，提高开发效率。赶快试试Vue CLI吧！
本文来自极简博客，作者：蔷薇花开，转载请注明原文链接：使用Vue CLI创建现代化的Vue.js项目
