创建vue项目结构

Posted 2020-12-26 startingpoint

vue官方有给vue项目提供一个官方命令行工具，官方的解释为：

　　Vue 提供了一个官方的 CLI，为单页面应用快速搭建 (SPA) 繁杂的脚手架。它为现代前端工作流提供了 batteries-included 的构建设置。只需要几分钟的时间就可以运行起来并带有热重载、保存时 lint 校验，以及生产环境可用的构建版本。更多详情可查阅 Vue CLI 的文档。

 

首先需要安装这个脚手架来运行vue。（我用的mac）

 

安装脚手架需要用到npm，但是npm的缺陷即是在国内使用的话会很慢很慢，这里推荐用淘宝的npm镜像；（安装时若遇到权限问题，在npm前面加上sudo，然后输入电脑密码即可）

$ npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完后就可以用cnpm代替npm了

 

然后就可以来安装vue-cli了，终端输入：

sudo cnpm install -g vue-cli

安装结束后 vue 就变成可执行的命令了

 

然后在终端进入自己要的目录，输入

vue init webpack myFirstVueProject　　

这里是下载依赖webpack的文件夹，可以看到终端进入下载模板阶段，静待下载完毕

下载完后会有几个问题：

? Project name my-first-vue-project      项目名称
? Project description (A Vue.js project)  项目描述
? Author (jindou <[email protected]>)  作者　　

以及是否安装几个插件的询问，我都选择否，然后文档目录就下载好了。 

然后进入 myFirstVueProject 运行

sudo cnpm install

来下载所有的依赖