VUE学习-webpack搭建Vue项目环境准备

来源:互联网 发布:php企业产品展示网站 编辑:程序博客网 时间:2024/05/20 05:10

  • 环境及配置
    • node
    • webpack
    • vue-cli
  • 检验


环境及配置

  1. node+npm 是必备的
  2. webpack
  3. vue-cli

以下所有命令均是命令行操作


node

官网传送门:戳这里
检查安装是否成功:终端输入node -v 和 npm -v
安装教程自行查找资料

安装成功后即可使用npm了,不过这个npm使用起来很慢,推荐使用淘宝镜像。有两种方式:

  1. npm地址直接指向淘宝镜像地址:npm config set registry https://registry.npm.taobao.org
  2. 使用cnpm:npm install -g cnpm --registry=https://registry.npm.taobao.org

使用cnpm后只需将命令中的 npm 替换为 cnpm 即可


webpack

安装前记得切换目录

官网传送门:戳这里

本地安装[建议]

本地安装最新版本:npm install --save-dev webpack
本地安装指定版本:npm install --save-dev webpack@<version>

全局安装[不推荐]

npm install --global webpack


vue-cli

官网传送门:戳这里
安装:npm install -g vue-cli

使用webpack模板初始化vue

初始化格式:vue init <template-name> <project-name>
具体的用法:vue init webpack my-project

检验

至此没有报错,则基本环境和配置完成。切换到项目目录,执行下列命令即可查看demo页面:

cd my-project
npm install
npm run dev

原创粉丝点击