1、安装依赖
npm install --save nprogress
2、在src目录下新建 permission.js
文件
import router from "@/router";
import NProgress from "nprogress"; // progress bar
import "nprogress/nprogress.css"; // progress bar style
NProgress.configure({ showSpinner: false }); // NProgress Configuration
router.beforeEach(async (to, from, next) => {
NProgress.start();
next();
});
router.afterEach(() => {
// finish progress bar
NProgress.done();
});
3、在main.js文件中导入
import "./permission";
这时还有问题,会有红色标记
Vue: Could not find a declaration file for module nprogress .
/Users/wang/Documents/docker/www/yunyou/website/web-pc/node_modules/nprogress/nprogress.js
implicitly has an any type.
Try npm i --save-dev @types/nprogress if it exists or add a new declaration (.d.ts) file containing declare module 'nprogress';
1、使用 npm 安装 @types/nprogress 库
npm i --save-dev @types/nprogress
这个命令将安装 nprogress
的类型定义文件,--save-dev
参数表示将其安装为开发依赖项,这样在其他项目中也可以使用。
2、如果第一步没有解决问题,你可能需要手动添加一个新的声明文件(.d.ts)来定义 nprogress
模块。你可以在项目根目录下创建一个名为 declarations.d.ts
的文件,并在其中添加以下内容
declare module 'nprogress';
这将告诉 TypeScript 在当前项目中存在一个名为 nprogress 的模块,但不提供具体的类型定义。这样,TypeScript 会将 nprogress 模块视为任何类型,并允许你在代码中使用它。
3、如果你已经安装了 @types/nprogress 库,并且仍然遇到这个错误,可能是因为 TypeScript 无法找到这个库。你可以在 tsconfig.json 文件中添加以下内容:
"typeRoots": [
"node_modules/@types"
]
发布时间 : 2024-01-25,阅读量:1265