首页 >web前端 >js教程 >vue之搭建本地项目

vue之搭建本地项目

零到壹度
零到壹度原创
2018-03-26 15:56:423153浏览

这次给大家带来vue之搭建本地项目,vue之搭建本地项目的注意事项有哪些,下面就是实战案例,一起来看一下。

一.

安装nodejs

链接:https://nodejs.org/zh-cn/

二.

安装webpack

安装命令:cnpm install webpack -g

安装完成,通过webpack -v来查看当前webpack版本

三.

接着安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架

安装命令:npm install -g vue-cli

安装完后,可以输入vue,或者vue -V,然后回车,如果出现vue的信息,则说明安装成功了。

四.

紧接着,就该创建项目了,自己找一个合适的地方,新建一个项目文件夹,根据自己的需要命名,我的命名为 my-vue,然后,打开此文件夹,右键git bash here,定位到此文件夹,输入:vue init webpack my-vue(项目文件夹名),回车,等待一小会儿,依次出现‘git’下的项,可按下图操作:


五.之后通过命令:cd vue-test 进入此文件夹,在利用命令:npm install,回车,等待一小会儿,回到项目文件夹,会发现项目结构里,多了一个node_modules文件夹(该文件里的内容就是之前安装的依赖)。

六.在命令行里继续输入 npm run dev来测试环境是否搭建成功,如果出现如下图说明成功了:


然后输入提示你的地址,我的是8081,出现下图,就ok了


相关推荐:

vue项目搭建步骤

命令行搭建vue的项目框架

vue.js在windows本地下搭建环境和创建项目

以上是vue之搭建本地项目的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn