vue-cli-service 怎么使用

### 如何使用 `vue-cli-service` 进行项目构建和服务

#### 安装 Node.js 和 Vue CLI
为了能够利用 `vue-cli-service` 提供的功能，首先需要确保本地环境已经安装了Node.js以及全局安装了Vue CLI工具[^2]。

#### 初始化项目结构
当创建一个新的Vue项目时，通常会通过执行`vue create project-name`来初始化一个基于Webpack模板的新工程。这个过程中间自动集成了`@vue/cli-service`作为核心的服务层支持[^4]。

#### 启动开发服务器
一旦项目建立完成，在项目的根目录下可以通过下面这条命令快速启动内置的HTTP Server用于前端页面调试：

npm run serve

这实际上是调用了`vue-cli-service serve`命令，它负责编译源码并通过热重载机制监听文件变化以便即时更新浏览器中的显示效果[^3]。

#### 执行生产打包
对于准备部署至线上的应用而言，则需借助于如下指令来进行优化后的资源压缩处理：

npm run build

上述操作背后真正被执行的是`vue-cli-service build`，此过程不仅限于简单的静态文件生成，还涵盖了诸如Tree Shaking、Code Splitting等一系列提升性能的技术措施[^1]。

#### 自定义命令扩展功能
除了标准提供的serve和build之外，还可以依据实际需求注册更多个性化的CLI子命令以满足特定场景下的工作流自动化要求。例如添加lint检查或者单元测试任务等，只需编辑package.json里的scripts字段即可轻松实现。