初识vue

使用vue-cli搭建项目


前言

请确保您的设备中已经安装完成npmnode环境,可在控制台进行验证,以下步骤默认您已经安装成功。

安装vue-cli

1
npm install vue-cli -g

注:为什么是全局?vue-cli工作原理是什么呢?

使用webpack“打包机”

1
2
# 当不填写project-name时便在当前目录下创建
vue init webpack your-project-name

安装模块到node_modules目录

1
2
# 如果填写了project-name需要先进入该文件
npm install <packageName>

npm模块安装机制简介,离线安装模块方法

运行

1
npm run dev

预览

这个就不用说了吧~

注:如何开启服务后自动打开?该文中有介绍。另外还可以直接修改文件config中的index.js,找到字段autoOpenBrowser,令其值为true即可。

到这里想必你已经看到你的第一个vue跑起来了,是不是很激动呢?来到了vue的大家族中,再来几篇文章吧:


扩展阅读:
1.怎么样也少不了的vue-cli官网文档
2.vue-cli#2.0webpack配置解析
3.webpack的中文文档

有问题?发送 issues 给我~

0%