Vue：安装创建构建部署

记录一次从零使用 vue 的经过(在 window 环境下)：

安装 nodejs，官网下载安装包，安装。

安装 Vue CLI，打开命令行工具，执行：npm install -g @vue/cli ，安装成功后通过 vue --version 查看其版本。

创建一个项目，执行 vue create hello-world ，选取默认 preset 就可以创建一个项目。

运行项目，在项目所在目录下，执行 npm run serve ，即可启动项目，浏览器访问 http://localhost:8080 即可看到主页。

关闭项目，命令行下 Crtl + c 即可关闭项目。

构建项目，执行 npm run build ，即可以生成项目的目标文件，存放在 dist 目录下。

部署项目，这里说的部署只是放在本机上运行。拷贝到 dist 目录到 D 盘下，现在项目构建好的文件位置是 D:/dist 。这里要注意 js css image 引入的相对位置。下载 nginx 包，解压，修改 ./conf/nginx.conf 文件，配置信息如下

server {
    listen       80;
    server_name  localhost;
    
    location / {
        root D:/dist;
        index index.html index.htm;
    }
}

然后启动 nginx ，执行 start nginx 。访问 http://localhost:80/index.html ，即可以看到部署好的项目主页。

实际在生产环境中还有许多需要解决的问题。