相信很多接触过vue的小伙伴非常熟悉了,我们在开启项目之前都需要vue init webpack xx来初始化自己的项目目录。但是在实际开发中我们往往会根据公司要求或者业务的需要会对目录进行局部的调整,那么今天我们来说一说如何能够创建自己的项目目录机构,要做这个也是非常的容易了

首先,我们需要全局安装 vue-cli

npm install vue-cli -g

  其次我们需要在自己的git仓库中上传想要应用的项目目录结构。这里的目录结构我主要是参考vue官方的模板。在github上找到vue官方的webpack模板。项目的目录结构如下

上传到自己的git仓库之后,我们就可以放心的来vue init自己想要的项目结构了

vue init username/repo my-project

  username为自己的git用户名,repo是仓库名

 cd my-project
$ npm install
$ npm run dev

  剩下来就是我们熟悉的节奏了,不足之处还请多多指教~

如何快速的vue init 属于自己的vue模板?的更多相关文章

  1. vue init深度定制团队自己的Vue template

    大家都知道,使用vue-cli可以快速的初始化一个基于Vue.js的项目,全局安装脚手架之后,你可以通过vue list命令看到官方提供的5个模板 vue list 当开发一个独立项目的时候,使用官方 ...

  2. 解决vue-cli不能初始化webpack模板的问题(vue init卡住了,解决办法)

    报这个错误 有人说是代理问题.我也不懂,但这个方法有用 1.去github上下载要初始化的模板 https://github.com/vuejs-templates/webpack 或者直接用git去 ...

  3. Vue.js——60分钟webpack项目模板快速入门

    概述 browserify是一个 CommonJS风格的模块管理和打包工具,上一篇我们简单地介绍了Vue.js官方基于browserify构筑的一套开发模板.webpack提供了和browserify ...

  4. Vue.js——60分钟browserify项目模板快速入门

    概述 在之前的一系列vue.js文章,我们都是用传统模式引用vue.js以及其他的js文件的,这在开发时会产生一些问题. 首先,这限定了我们的开发模式是基于页面的,而不是基于组件的,组件的所有代码都直 ...

  5. 快速构建一个简单的单页vue应用

    技术栈 vue-cli webpack vux,vux-loader less,less-loader vue-jsonp vue-scroller ES6 vue-cli:一个vue脚手架工具,利用 ...

  6. Vue.js——60分钟webpack项目模板快速入门

    概述 browserify是一个 CommonJS风格的模块管理和打包工具,上一篇我们简单地介绍了Vue.js官方基于browserify构筑的一套开发模板.webpack提供了和browserify ...

  7. Vue.js——60分钟browserify项目模板快速入门

    概述 在之前的一系列vue.js文章,我们都是用传统模式引用vue.js以及其他的js文件的,这在开发时会产生一些问题. 首先,这限定了我们的开发模式是基于页面的,而不是基于组件的,组件的所有代码都直 ...

  8. vue init webpack-simple

    vue init webpack-simple  .. 将我们的项目更加方便,更有助于开发者快速开发. vue init webpack-simple的项目默认打包后之后一个html和一个js文件,而 ...

  9. vue init定制团队模板使用方法

    每次做项目都要自己搭建项目目录,或者换了公司就的重新搭建项目目录,是不是很麻烦呢?有没有想过一次性把项目目录搭建好,以后直接用呢?你首先想到的可能是复制自己原来的项目,然后删除.修改等等.然而有个更方 ...

随机推荐

  1. POJ 1651 Multiplication Puzzle 区间dp(水

    题目链接:id=1651">点击打开链 题意: 给定一个数组,每次能够选择内部的一个数 i 消除,获得的价值就是 a[i-1] * a[i] * a[i+1] 问最小价值 思路: dp ...

  2. PNG vs. GIF vs. JPEG vs. SVG - When best to use?

    image - PNG vs. GIF vs. JPEG vs. SVG - When best to use? - Stack Overflow https://stackoverflow.com/ ...

  3. RDA 互斥锁的使用

    在多线程下,在同一时间内,可能有多个线程在操作.如果没有同步机制,那么很难保证每个线程操作的正确性. 1.互斥锁概念: 互斥锁提供一个可以在同一时间,只让一个线程访问临界资源的的操作接口.互斥锁(Mu ...

  4. 学生表、课程表、 成绩表 、教师表sql练习

    转自:http://yuncode.net/code/c_58df7a8ca687e58 1.查询“1”课程比“2”课程成绩高的所有学生的学号: SELECT t1.student_id FROM   ...

  5. jQuery的each内部的break,continue

    // break, continue在each等迭代器里都不可用 // return false = break // return true = continue function isClicke ...

  6. bzoj 1087: [SCOI2005]互不侵犯King【状压dp】

    显然是状压,设f[i][j][k]为1到i行选j个king,并且第i行状态为k的方案数,判断是否可行然后枚举转移即可 先把可行状态预处理出来会变快 #include<iostream> # ...

  7. Java实现短信中提取号码

    Description 提取一条短信里所有的电话号码,电话号码之间换行打印,短信的内容由用户输入. Input 第一行有个整数n(1≤n≤1000)表示测试用例的个数.其后的每一行中有一条短信,每一条 ...

  8. Java实现日期时间对象的使用

    利用类对象计算日期 在利用Java语言进行信息系统开发中,经常需要对日期进行计算和转换,比如,设置了某活动的开始日期和结束日期,系统需要判断当前是否是该活动时间,在Java开发的信息系统中,通常日期以 ...

  9. 数据传递-------@PathVariable

    package com.wh.handler; /** * 通过@PathVariable可以绑定占位符参数到方法参数中,例如 * @PathVariable("userId") ...

  10. windows 中常用的 cmd 命令汇总

    查看系统基本信息: cmd -> systeminfo 或 run -> dxdiag 查询主板出厂日期: cmd -> wmic bios get releasedate 关闭本地 ...