创建VUE项目

一、npm安装

npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装、卸载npm uninstall、管理依赖、查看已安装插件npm list)
1.nodejs.org中下载node.js,一直next到安装完成
2.检查是否安装成功

控制命令行程序(CMD)

3.使用淘宝NPM镜像,用cnpm命令来安装模块(因为npm安装插件是从国外服务器下载的,受网络影响大,容易出现异常)
$ npm install -g cnpm --registry=https://registry.npm.taobao.org

二、项目初始化

1.安装vue-cli
vue的脚手架工具,帮助写好vue.js基础代码的工具

  • cnpm install vue-cli -g //全局安装vue-cli
  • vue list //通过检查vue版本号来看vue-cli是否成功
  • 选定路径,新建vue项目(在桌面新建一个vue文件夹,cd进入)
  • vue init webpack <项目名称>


    创建一个名为vue-demo的项目

    创建完成后,给项目安装依赖后再运行,会出现如下页面,操作指令为:

  • cnpm install
  • cnpm run dev
    需要注意,此时要在vue-demo项目文件内安装和运行!
    运行过程
  • 访问localhost:8080或者127.0.0.1:8080看下效果


    成功啦!!!哈哈哈
  • 利用vue-cli初始化创建vue项目的初始化文件夹结构如下:


    初始化的文件结构

完成啦~接下来的vue之旅:vue官网

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容