首页 > 技术文章 > vue项目搭建步骤

qianjin888 2018-11-16 11:08 原文

https://blog.csdn.net/echo008/article/details/77099058

https://blog.csdn.net/echo008/article/details/77099058

 

一. vue-cli初始化
1. 全局安装 vue-cli
npm install --global vue-cli
2. 创建一个基于 webpack 模板的新项目
vue init webpack my-project
3. 安装依赖
cd my-project
npm install (换源安装: npm install --registry https://registry.npm.taobao.org )
npm run dev


二. 安装额外的依赖包
1. 两种依赖包的安装方式
1.1 项目依赖包
npm install --save vue
1.2 开发依赖包
npm install --save-dev webpack
2. less依赖包
npm install --save-dev less less-loader
3. 网络请求axios依赖包
npm install --save axios
4. axios低版本浏览器补丁es6-promise依赖包
npm install --save es6-promise
5. 路由安装
npm install --save vue-router
6. 状态管理安装
npm install --save vuex
7. PC端组件库
npm install --save element-ui
8. 移动端组件库
npm install --save mint-ui
9. 上传服务器ssh2
npm install –save-dev ssh2
10. cookie封装库
npm install --save js-cookie


三. 打包配置修改
1. 打包后缀修改
app.8e46a5291871ede4d0a6.js -- app.20170329145640428.js
1.1 build/utils文件添加

exports.nowTime = {
  time: null,
  getTime: function () {
    if(!this.time){
      var date = new Date()
      var year = date.getFullYear()
      var month = date.getMonth() + 1
      month = month > 9 ? month : '0' + month
      var day = date.getDate()
      day = day > 9 ? day : '0' + day
      var hour = date.getHours()
      hour = hour > 9 ? hour : '0' + hour
      var minute = date.getMinutes()
      minute = minute > 9 ? minute : '0' + minute
      var second = date.getSeconds()
      second = second > 9 ? second : '0' + second
      var milli = date.getMilliseconds()
      milli = milli > 100 ? milli : milli > 10 ? '0' + milli : '00' + milli
      this.time = year + '' + month + '' + day + '' + hour + '' + minute + '' + second + '' + milli
    }
    return this.time
  }
}

  

推荐阅读