windows7系统搭建vue环境

  • 一，安装node.js，去官网下载，建议不要安装在C盘，安装过程中可以选择安装路径，我的安装路径如图：
    安装路径

    安装成功后，在命令行输入node --version会显示当前安装的node.js版本
  • 二，设置node.js prefix(全局)和cache(缓存)路径
    新建node_global和node_cache两个文件夹，路径最好是英文，如图：
    2.png

    设置缓存文件夹：
    npm config set cache "D:\DevelopmentPath\node_cache
    设置全局模块存放路径：
    npm config set prefix "D:\DevelopmentPath\node_global
    设置成功后，之后用命令行npm install XXX -g安装的模块就在D:\DevelopmentPath\node_global里
    在命令行输入npm --version,会输出当前的npm版本
  • 三，基于node.js安装cnpm(淘宝镜像)
    npm install -g cnpm --registry=https://registry.npm.taobao.org
  • 四，设置环境变量(非常重要)
    说明：设置环境变量可以使得在任意目录下都可以使用cnpm、vue等命令，而不需要输入全路径
    1） 鼠标右键"此电脑"，选择“属性”菜单，在弹出的“系统”对话框中左侧选择“高级系统设置”，弹出“系统属性”对话框
    2） 修改系统变量path
    系统变量1

    系统变量2

    3） 新增系统变量NODE_PATH
    系统变量3

    系统变量4
  • 五，安装全局的webpack
    npm install webpack –g
  • 六，安装vue脚手架vue-cli
    npm install vue-cli –g
    在命令行里输入vue --version,验证是否安装成功
  • 七，找一个合适的位置存放你的vue工程，然后cd到该目录
  • 八，创建项目
    vue init webpack-simple 项目名
    注：项目名不可以使用中文，也不能使用大写字母
  • 九，将根目录切换到项目
    cd 项目名，如：cd vue2demo
  • 十，安装项目依赖
    npm install
  • 十一，安装 vue 路由模块vue-router和网络请求模块vue-resource
    npm install vue-router vue-resource –save
  • 十二，启动项目
    npm run dev
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容