vue入门——1环境搭建及项目构建启动

版权声明:开放学习,交流共享,笔记之地。 https://blog.csdn.net/itwxming/article/details/88189821

一、vue.js开发环境搭建:

      1、安装Node.js。NodeJs的包管理器npm。npm集成了最多的前端插件,配置命令或者命令行即会下载对应开源插件、项目。npm集成在了Node.js中,所以安装Node.js的时候便安装了。

      2、由于资源限制,安装npm依赖包的时候经常失败。建议使用npm的国内镜像cnpm命令行工具代替默认的npm。

npm国内镜像https://npm.taobao.org/

在命令行中输入以下内容等待安装更换npm镜像地址。

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

      3、安装Vue-cli脚手架,官方脚手架。

在命令行输入以下内容等待安装:

cnpm install -g vue-cli

二、构建Vue项目

1、安装好Vue环境后即可进行Vue项目开发:

在此目录下创建一个基于webpack模板的新项目,即在cmd中输入以下命令:

vue init webpack testVue

该项目testVue基于webpack打包和压缩。

输入命令后,在此过程中还需要逐步输入项目名称、描述、作者等,不填就是括号中默认的。

那些选项可选No。(上图项目构建成功后有后续命令提示。)

安装项目依赖文件

安装之后:目录里是项目的依赖文件。

三、运行项目

使用命令npm run dev 运行项目。命令执行后会跳到npm黑窗口,里面有项目访问路径。

此时项目构建成功。之后的开发在src目录下进行开发。在命令行窗口按Ctrl+C便能停止项目。

猜你喜欢

转载自blog.csdn.net/itwxming/article/details/88189821