vue 搭建项目

1、首先检查环境

2、查看当前镜像

npm get registry

3、创建项目

vue create my_test

 4、执行以下

npm uninstall -g vue-cli
npm install -g @vue/cli

5、继续创建

vue create my_test

6、创建完成后，进入文件夹

cd my_test

 不在需要 npm install

直接运行即可。

npm run serve

http://localhost:8080/

 

npm i element-ui -S

 安装路由

npm install vue-router@4

 安装国际化

npm install vue-i18n --S

 

{
  "name": "my_test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.8.3",
    "element-ui": "^2.15.13",
    "vue": "^2.6.14",
    "vue-i18n": "^9.2.2",
    "vue-router": "^4.2.2"
  },
  "devDependencies": {
    "@babel/core": "^7.12.16",
    "@babel/eslint-parser": "^7.12.16",
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-plugin-eslint": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "eslint": "^7.32.0",
    "eslint-plugin-vue": "^8.0.3",
    "vue-template-compiler": "^2.6.14"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "@babel/eslint-parser"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

 

使用element-ui

Elementhttps://element.eleme.cn/#/zh-CN/component/quickstart

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';

Vue.config.productionTip = false
Vue.use(ElementUI);

new Vue({
  el: '#app',
  render: h => h(App)
});