VueJS 环境的搭建

使用git搭建VueJS开发环境

安装git

git官网下载： https://www.git-scm.com/download/

安装后进入 git bash 终端

安装nodeJS

安装git后，我们需要使用npm工具，这时候就要安装nodeJS了，因为nodejs会自带npm工具。

nodeJS官网下载： https://nodejs.org/en/download/

之后就像安装软件一样安装就行了，成功后，可以在git bash终端中查看版本，显示了版本，就说明你已经安装成功了。

$ node -v
$ npm -v

安装webpack:最新版本

npm install --save-dev webpack

其他安装参考webpack官方文档：

https://webpack.js.org/guides/installation/

安装vueJS

官方文档参考安装：

https://cn.vuejs.org/v2/guide/installation.html

1. 独立版本

可在Vue.js官网上直接下载vue.min.js并用<script>标签引入。

下载Vue.js：https://vuejs.org/js/vue.min.js

2. 使用CDN

unpkg：https://unpkg.com/vue/dist/vue.js, 会保持和npm发布的最新的版本一致。

3. NPM方法

觉得npm安装速度慢的话，也可以使用淘宝的镜像及其命令cnpm

使用淘宝NPM镜像：npm命令

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

搭建Vue工程

• 1. 安装脚手架vue-cli:

  • 全局安装脚手架vue-cli(命令行工具)：

    cnpm install

    $ cnpm install --global vue-cli

    or npm install

    npm install -g @vue/cli

    or yarn install

    yarn global add @vue/cli

  注意：-g或者global表示全局安装，不加-g或global表示本项目安装

  • Vue CLI 指南

  https://cli.vuejs.org/guide/

• 2. 初始化项目 Vue init <template-name> <project-name>

  Vue init webpack my-project

  之后进行一些配置，默认回车就行，完成后终端有项目启动的提示。

  以为之前自己搭建项目环境的时候，使用npm install的时候太慢了，而且会报错，改下用淘宝镜像初始化就行了

  npm install --registry=https://registry.npm.taobao.org
npm run dev

项目就搭建完成了！

当然如果你是用vue3.0版本的话，你的配置文件package.json就会自动生成命令

"scripts": { "build": "vue-cli-service build", "serve": "vue-cli-service serve" }

如果没有跑成功，就需要看看配置文件package.json中的配置是否有问题。