Quasar创建项目

如果已经有环境可以直接从创建项目开始！！！

1.安装nodeJs

2.配置环境变量

3.安装npm

4.安装yarn

npm install --global yarn

Mac安装：sudo npm i yarn -g

验证：yarn -v

5.创建项目

先到指定盘，cmd然后输入“yarn create quasar”，回车输入要建立的文件夹，下面都是回车！！！项目就建立好了！！！（如果安装TypeScript，回车的时候选择一下）

或者

Mac是打开终端，输入cd ，然后将想创建的文件夹的父级拖入终端（获取路径）

6.安装pinia

npm install pinia

7.安装axios

npm install axios

8.安装quasar框架

yarn global add @quasar/cli

9.安装淘宝镜像【将镜像源换成淘宝的，这样会下载的更快一点 设置过程如下（此过程为永久设置）】

npm config set registry http://registry.npm.taobao.org

检查转换镜像源是否成功:npm config get registry

10.安装vue

npm install vue -g

11.安装webpack模板

npm install webpack -g

安装webpack-cli：npm install --global webpack-cli
安装成功后可使用webpack -v查看版本号

12.安装store（先安装淘宝镜像）

1）安装vuex

npm install vuex --save

2）新建目录文件（src目录下新建一个目录store）

3）写入内容:

index.js

import createPersistedState from 'vuex-persistedstate'
import Vue from 'vue'
import Vuex from 'vuex'
// 用户信息模块
import common from './modules/common';
Vue.use(Vuex)export default new Vuex.Store({
    modules: {
        common,
    },
    plugins: [createPersistedState({
        // vuex持久化插件
        storage: window.sessionStorage
    })]})

common.js

const common = {
    state: {
        token: '04'
    },
    mutations: {
        SET_TOKEN(state, v) {
            state.token = v
        }
    },
    actions: {
        setToken({commit}, data) {
            commit('SET_TOKEN',data)
        }
    },
    getters: {

    }};
export default common;

使用方法

<script>
import { mapState } from "vuex";
export default {
  data() {
    return {};
  },
  computed: mapState({
    token: (state) =>{
      return state.common.token;
    }
  }),
  mounted(){
    console.log(this.token);   //获取值
    this.$store.dispatch("setToken", '06');   //改变值  注:持久改变
    console.log(this.token);
  },
};</script>

13.安装TypeScript（全局安装Ts）

npm i -g typescript

初始化: tsc -init

14.安装依赖（下载克隆别人的项目的时候）

yarn install