vue垂死挣扎系列——vue-cli快速搭建

Posted 2021-01-06 hiluna

项目安装(windows10安装环境+vue-cli 2.x）

• 安装node
  • 在官网上下载稳定版本的node node.js官网
  • 一路傻瓜安装
  • 测试是否安装成功 cmd中node --version
• 安装vue-cli 2.x
  • npm install -g vue-cli (全局安装vue-cli 2.x，可能较慢，建议下面方法）
  • npm install -g cnpm ----registry=https://registry.npm.taobao.org (使用国内镜像）
    若是cnpm -v成功之后 继续 cnpm install -g vue-cli
• 生成项目(init)
  • vue init webpack my-project (项目名字my-project,会在当前目录下生成)
  • cd my-project
  • cnpm install (安装依赖 node_modules)
  • npm run dev (启动项目，默认为localhost:8080端口）
• 打包上线
  • npm run build （文件项目基本都在src中，打包后会生成dist文件夹，项目上线使，只需要将dist文件夹放到服务器中就可以了)

项目安装(windows10安装环境+vue-cli 3.x）

现在vue-cli已经升级到3版本了，继续??

• 安装node
  • 下载node，注意版本，vue-cli 3.x 要求node的版本需要8.9甚至更高版本（推荐LTS 8.11.3)
  • 步骤同上
• 安装vue-cli 3.x
  • npm install -g @vue/cli (是的，你没有看错，包换名字了，vue-cli改名叫@vue/cli了）
    可在cmd中，查看vue --version是否成功
• 创建项目 （create)
  • vue create my-project
  • cd my-project
  • npm run serve (注意直接run serve就行了，不需要 run dev了）
• 打包上线
  • npm run build