如何搭建vue项目基本模板

2017-06-07  本文已影响0人  水哥一点也不水

我最近在学习如何用使用Vue.js2.0+Vuex+webpack搭建一个web项目.其中遇到的一个问题就是如何在项目中使用sass.

首先创建一个基于webpack的Vue项目模板

按照Vuejs的官方文档,我们需要安装最新版本Vue(前提是你的环境已经有nodejs和npm了)

$ npm install vue

接下来是Vuejs官方命令行工具

$ npm install --global vue-cli

至此,我们就可以开始创建一个基于webpack模板的新项目了

$ npm vue init webpack my-project

上面命令的末尾my-project是项目默认的名称,当然你也可以写成你自己起的名字,接下来就是在终端里面操作,根据提示信息,就是敲回车还有y或者n,其中有一项需要注意:就是Use ESLint to lint your code?(y/n),意思是说是否需要ESLint检查你的编码,建议选择n.其余项目一律y就可以了,接着就可以按照终端的提示来启动你的vue项目啦.

在项目中不适用ESLlint 进入你的工程路径,npm install,npm run dev

所有工作正常完成后,浏览器会自动弹出项目的窗口,默认端口号是8080,当然我们也可以来更改默认端口.找到config/index.js,dev配置项里的port:8188(我自己改成了8188).至此,一个基本的vue项目模板就搭建好了.

上一篇下一篇

猜你喜欢

热点阅读