vue2 新建项目及相关配置

vue2 新建项目及相关配置

仅做记录

一.新建项目

1.打开powershell，全局安装脚手架
npm install vue-cli -g
2.全局安装 webpack：npm install webpack -g
3.vue init webpack project（project是项目名）创建项目

//根据项目需求配置
? Target directory exists. Continue? Yes//先在git上建的仓库所以文件名已存在
? Project name low_code//文件名
? Project description//项目描述，直接回车
? Author Author <a2k7ReK1Xismgy9KXsTQ>//作者
? Vue build standalone//构建模式，默认第一种
? Install vue-router? Yes //是否安装路由
? Use ESLint to lint your code? No //是否使用严格模式
? Set up unit tests No //是否使用单元测试
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recommended) npm //是否创建项目后初始化项目，建议使用npm

二.引入element-ui

1.安装element npm install element-ui --save
2.在main.js中引入

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(Router)
Vue.use(ElementUI);
export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    }
  ]
})

三.配置router文件

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/Pages/Home'
const originalPush = VueRouter.prototype.push

VueRouter.prototype.push = function push(location, onResolve, onReject) {
  if (onResolve || onReject) {
    return originalPush.call(this, location, onResolve, onReject)
  }
  return originalPush.call(this, location).catch(err => err)
}


Vue.use(VueRouter);

export default new VueRouter({
  routes: [
    { path: '/', name: 'Home', component: Home },
  ]
})

四.上传git仓库

新建一个git仓库，在vs code打开项目，依次输入命令将代码上传

git init 
git remote add origin 仓库地址
git add .
git commit -m "Initial commit"
git push -u origin master