vue3引入自定義的js文件
有一個自己寫的js庫A,需要在vue項目B里調用。A還在開發中,經常修改不宜放在B里,加之別的vue項目也經常調用A。所以需要在vue項目里引用外部路徑。
先修改vite.config.js:
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
'@zlib': fileURLToPath(new URL('../../js/zlib', import.meta.url)) },
}
}
其中的zlib就是自己寫的庫。這是vue的別名系統。
再修改tsconfig.app.json:
{
"extends": "@vue/tsconfig/tsconfig.dom.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
"exclude": ["src/**/__tests__/*"],
"allowJs":true,
"compilerOptions": {
"noImplicitAny":false,
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"paths": {
"@/*": ["./src/*"],
"@zlib/*":["../../js/zlib/*"]
}
}
}
其中paths行添加:
"@zlib/*":["../../js/zlib/*"]
這是ts的別名系統。
另外添加的
"allowJs":true,
"noImplicitAny":false,
是消除ts編譯時候的報錯。
最后就可以在vue項目里引用了:
import {xxx} from '@zlib/ABC.js"

浙公網安備 33010602011771號