webstorm+vue初始化项目的方法


Posted in Javascript onOctober 18, 2018

vue新项目准备:

1、安装nodejs,官网下载傻瓜安装

node -v 验证

2、npm包管理器,是集成在node中的,所以安装了node也就有了npm

npm -v 验证

3、安装cnpm

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

(完成之后,我们就可以用cnpm代替npm来安装依赖包了。如果想进一步了解cnpm的,查看淘宝npm镜像官网。)

4、安装vue-cli脚手架构建工具

npm install -g vue-cli

vue新项目构建:

1、初始化项目模板:

vue init webpack-simple yunshi-approve

或者

vue init webpack yunshi-approve

2、安装npm

cd yunshi-approve

3、安装项目所需要的依赖:

npm install 或 cnpm install

4、运行看效果:

npm run dev

介绍一下目录及其作用:

build:最终发布的代码的存放位置。

config:配置路径、端口号等一些信息,我们刚开始学习的时候选择默认配置。

node_modules:npm 加载的项目依赖模块。

src:这里是我们开发的主要目录,基本上要做的事情都在这个目录里面,里面包含了几个目录及文件:

assets:放置一些图片,如logo等

components:目录里放的是一个组件文件,可以不用。

App.vue:项目入口文件,我们也可以将组件写这里,而不使用components目录。

main.js :项目的核心文件

static:静态资源目录,如图片、字体等。

test:初始测试目录,可删除

.XXXX文件:配置文件。

index.html:首页入口文件,可以添加一些meta信息或者同统计代码啥的。

package.json:项目配置文件。

README.md:项目的说明文件。

以上这篇webstorm+vue初始化项目的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
关于jquery append() html时的小问题的解决方法
Dec 16 Javascript
suggestion开发小结以及对键盘事件的总结(针对中文输入法状态)
Dec 20 Javascript
js中的replace方法使用介绍
Oct 28 Javascript
HTML5使用DeviceOrientation实现摇一摇功能
Jun 05 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
Jul 09 Javascript
jQuery使用方法
Feb 04 Javascript
ES6新特性五:Set与Map的数据结构实例分析
Apr 21 Javascript
JavaScript调试之console.log调试的一个小技巧分享
Aug 07 Javascript
Vue多组件仓库开发与发布详解
Feb 28 Javascript
JS Web Flex弹性盒子模型代码实例
Mar 10 Javascript
vue treeselect获取当前选中项的label实例
Aug 31 Javascript
解决iview table组件里的 固定列 表格不自适应的问题
Nov 13 Javascript
使用微信小程序开发弹出框应用实例详解
Oct 18 #Javascript
vue: WebStorm设置快速编译运行的方法
Oct 18 #Javascript
vue2.0 路由模式mode="history"的作用
Oct 18 #Javascript
详解vue文件中使用echarts.js的两种方式
Oct 18 #Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
Oct 18 #Javascript
vue中使用cookies和crypto-js实现记住密码和加密的方法
Oct 18 #Javascript
vue中导出Excel表格的实现代码
Oct 18 #Javascript
You might like
让php处理图片变得简单 基于gb库的图片处理类附实例代码下载
2011/05/17 PHP
解析php中static,const与define的使用区别
2013/06/18 PHP
php面向对象中的魔术方法中文说明
2014/03/04 PHP
Zend Framework教程之请求对象的封装Zend_Controller_Request实例详解
2016/03/07 PHP
php 策略模式原理与应用深入理解
2019/09/25 PHP
JavaScript获取GridView选择的行内容
2009/04/14 Javascript
js获取input长度并根据页面宽度设置其大小及居中对齐
2014/08/22 Javascript
jQuery实现高亮显示的方法
2015/03/10 Javascript
window.location.hash知识汇总
2015/11/09 Javascript
Vuejs第十三篇之组件——杂项
2016/09/09 Javascript
基于jQuery ligerUI实现分页样式
2016/09/18 Javascript
获取IE浏览器Cookie信息的方法
2017/01/23 Javascript
JS 中使用Promise 实现红绿灯实例代码(demo)
2017/10/20 Javascript
JS运动特效之同时运动实现方法分析
2018/01/24 Javascript
javascript动态创建对象的属性详解
2018/11/07 Javascript
基于Koa(nodejs框架)对json文件进行增删改查的示例代码
2019/02/02 NodeJs
python进阶教程之词典、字典、dict
2014/08/29 Python
python迭代器实例简析
2014/09/25 Python
Python中基础的socket编程实战攻略
2016/06/01 Python
python实现杨辉三角思路
2017/07/14 Python
使用Python向C语言的链接库传递数组、结构体、指针类型的数据
2019/01/29 Python
WxPython建立批量录入框窗口
2019/02/27 Python
python 判断linux进程,并杀死进程的实现方法
2019/07/01 Python
python通过对字典的排序,对json字段进行排序的实例
2020/02/27 Python
Python如何省略括号方法详解
2020/03/21 Python
Python脚本导出为exe程序的方法
2020/03/25 Python
PyCharm上安装Package的实现(以pandas为例)
2020/09/18 Python
python 检测图片是否有马赛克
2020/12/01 Python
PyCharm+Miniconda3安装配置教程详解
2021/02/16 Python
财政局长自荐信范文
2013/12/22 职场文书
宿舍使用违章电器检讨书
2014/01/12 职场文书
元旦标语大全
2014/10/09 职场文书
倡议书范文大全
2015/04/28 职场文书
《童年的发现》教学反思
2016/02/18 职场文书
解决Django transaction进行事务管理踩过的坑
2021/04/24 Python
解决Jenkins集成SonarQube遇到的报错问题
2021/07/15 Java/Android