Day 25 - Vue CLI 与 npm

在进行开发的时候，我们常常会下载各式各样的library，如果我们没有一个工具来帮助我们维护这些套件的版号、相依性，一旦套件的数量变多，会变得更难进行维护。

因此Package Manager变应运而生，不过Packager Manager酸是一种通用型的概念，意旨帮助我们进行套件维护，所以像是Python的pip、C#的nuget、Jave的maven，以及今天的主角npm都是属於package manager。

而甚麽是npm呢?

NPM 是 Node Package Manager 的简称，它是一个线上套件库，可以下载各式各样的 Javascript 套件来使用。
载点如下:
https://www.npmjs.com/

记得npm要搭配node一起服用，下载完後，我们把npm加入环境变数之後，便可以来测试看看是否成功。

当有出现板号时代表安装成功了!
如果要下载新的套件，就只要使用npm install xxx(套件名)就会开始下载。

有了对npm的基本概念後，那甚麽是vue cli呢?
Vue CLI (Vue.js Command-Line Interface)是由 Vue.js 核心团队所开发，用来提供开发者快速建置 Vue.js 专案并整合相关工具的一套命令列 (command-line) 工具。它的特色是提供开发者在短短的几分钟时间内，即可快速建置一个立即可用的 Vue.js (含 2.x/3.x) 示范专案，这个专案同时也内建了 Hot-Reload、ES Lint 与 dev-Server 等功能。
除此之外呢，Vue CLI 整合了 webpack 和 webpack-dev-server，用来快速的打包专案，让开发者可以快速建置一套立即可用的开发环境。

要怎麽安装呢?

npm install -g @vue/cli

透过 Vue CLI 建立专案的方式非常简单，开启 Terminal 终端机後输入：

vue create [专案名称]

下完指令後，会询问你想装那些套件进入你的专案中。

等一切都搞定之後，我们就可以直接下以下命令run起Service。

npm run serve

看到上面那张图的话代表执行成功了。