Vue3+TS+Vite+pinia

一、创建项目

       创建文件夹，然后cmd，输入以下内容。然后选择TS版本。

npm create vite

二、安装依赖

     在vs code中，使用终端，输入命令 

npm i

三、安装其他插件

       3.1、路由 vue-router

                多页面应用需要安装路由。所以需要使用vue-router。

npm i vue-router

      3.2、全局插件 pinia

              vue有两个全员插件，vueX和pinia，这里我们使用pinia。

npm i pinia

     3.3、请求 Axios

npm i axios

     3.4、前端框架 element plus

npm i element-plus

 四、运行项目      

npm run dev

退出终端命令：

cls

 

 五、初始化代码环境

         5.1、修改App.vue      

     5.2、修改style.css

     5.3、删除HelloWorld.vue       

 六、开始项目

        6.1、路由配置

                1、 新增文件夹views。           

         2、配置路由

  3、启用路由

         4、测试运行

 

       到这里页面就已经完全配置好了。

      6.2、安装sass     

              1、安装       

npm i sass sass-loader -D

             2、使用

        6.3、使用Element plus

 

             

            6.4、MD5加密密码                  

npm install md5js

     6.5、安装NProgress

npm install --save nprogress

              因为我们的事TS项目，还需要安装其类型声明文件，否则会报错。编译不过。

npm i @types/nprogress -D

    6.5、pinia持久化更新

nmp i pinia-plugin-persistedstate

    不能用。卸载

npm r pinia-plugin-persistedstate