使用vue脚手架快速创建vue项目(入门)

使用vue脚手架快速创建vue项目(入门)

1.安装环境

为了方便，以下操作大多数中命令行中运行，window可以用cmd,powershell,gitbash等 我用的gitbash。

安装node.js

打开它的官网，或者中文网站，然后直接下载就可以了，然后跟安装普通的应用一样，直接安装就好了。
查看node和npm的版本
直接用命令行分别运行下边命令，出现如图，就说明安装完成

npm的服务器在国外，为了方便，可以选择安装cnpm

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

安装vue-cli（脚手架）

直接运行下边命令。如果是mac或者linux，因为有参数-g，所以在命令前加上sudo 或使用su安装

cnpm install -g @vue/cli
或
npm install -g @vue/cli

注意：

1、 安装脚手架常见问题

1. 如果你是使用window系统，打开vscode的时候，用管理员模式打开

2. 如果之前装node,版本低于8.9，安装最的版本（10.x以上）；如果之前 node 安装在其它盘，请重新按照默认安装到C盘

3. 运行命令 vue serve index.vue 没有效果，那么你们就看看是否在 index.vue 所在目录运行

4. 另外mac系统，linux 系统，运行命令之前，请加 sudo 如下所示

   sudo npm install @vue/cli -g
   

5. 如果你是window系统，并且vscode里面的终端是 powershell,请先切回 cmd

拷贝被人的 npm 到本地c

2、安装脚手架一直不成功

如果安装脚手架一直不成功 拷贝被人的 npm 到本地

2、创建你的项目文件

vue create myapp  //myapp是你的项目名,

这句命令执行时会有一些选择项，这些具体的设置项在vue cli的官网都有说明，按你项目需要进行选择

按照我的需要就是：


回车

3、创建完用如下代码运行

通过访问

http://localhost:8081 

还有一些其他命令 可以看看

- npm run serve 开发环境构建 
- npm run build 生产环境构建 
- npm run lint 代码检测工具