Vue基础第一篇 - 搭建项目

首先来搭建项目吧。(node环境就不用说了 肯定要的)

使用vue-cli、webpack来搭建项目

全局安装webpack、vue-cli。如果要跟着这篇学习  请更新一下webpack、vue-cli。越新越好用嘛。哈哈

npm install webpack -g

npm install -g vue-cli

vue init webpack your-vue        //开始搭建项目

Vue基础第一篇 - 搭建项目

如果你不小心开启了ESlint。可以去build文件夹下的webpack.base.conf.js文件里面删除下面红框里代码,然后重新启动服务。

Vue基础第一篇 - 搭建项目

新版的vue-cli好像是直接就下载了node_modules

cd your-vue

npm install //如果没有下载node_modules。这是一个漫长的过程

npm run dev

浏览器打开localhost:8080

ok 当你看到vue的巨大logo 就表示 项目搭建好了。

我这样来管理项目文件,请看下图

Vue基础第一篇 - 搭建项目


博友们。这一篇就到这里吧。PS:老板叫我去改bug了。

接下来我会把vue项目实战、优化的经验跟大家继续分享。

github地址:https://github.com/beitafive/study-vue