Vercel构建大小与本地构建大小不同



我正在使用Vercel部署我的Nuxt项目(通过gitlab(,最近我的构建失败,并显示错误消息

"无服务器功能";索引";为119.68mb,超过了50mb的最大大小限制">

这有点奇怪,因为当我尝试在本地构建它时,我的dist文件夹只有大约7.92MB。有人有同样的问题吗?如何在Vercel构建中跟踪Nuxt项目的大小?是什么原因导致本地构建与推送给Vercel的不同?

我试着在本地构建它,结果发现它只有7.92 MB,难道构建的版本不应该和推送到Vercel的版本一样吗?

这是我的nuxt.config.js

export default {
// Global page headers: https://go.nuxtjs.dev/config-head
head: {
title: 'maimbau',
htmlAttrs: {
lang: 'en'
},
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: '' },
{ name: 'format-detection', content: 'telephone=no' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
]
},
// Server Configuration
server: {     
port: 8000, // default: 3000     
host: 'localhost', // default: localhost   
},   // other configs 
// Global CSS: https://go.nuxtjs.dev/config-css
css: [
],
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
plugins: [
{ src: '@/plugins/vue-awesome-swiper', mode: 'client' },
{ src: "@/plugins/aos", ssr: false }
],
// Auto import components: https://go.nuxtjs.dev/config-components
components: true,
// Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
buildModules: [
// https://go.nuxtjs.dev/eslint
'@nuxtjs/eslint-module',
// https://go.nuxtjs.dev/stylelint
'@nuxtjs/stylelint-module',
// https://go.nuxtjs.dev/tailwindcss
'@nuxtjs/tailwindcss',
],
tailwindcss: {
configPath: 'tailwind.config.js',
exposeConfig: false,
config: {},
injectPosition: 0,
},
// Modules: https://go.nuxtjs.dev/config-modules
modules: [
// https://go.nuxtjs.dev/axios
'@nuxtjs/axios',
],
// Axios module configuration: https://go.nuxtjs.dev/config-axios
axios: {},
// Build Configuration: https://go.nuxtjs.dev/config-build
build: {
postcss: {
plugins: {
tailwindcss: {},
autoprefixer: {},
"postcss-custom-properties": false
},
},
},
buildDir: 'dist',
router: {
extendRoutes(routes, resolve) {
routes.push({
name: 'demo_recipient',
path: '/demo/undangan/:theme/:greeting/:recipient',
component: resolve(__dirname, 'pages/demo/undangan/_theme.vue')
}),
routes.push({
name: 'webview_recipient',
path: '/:catin/:greeting/:recipient',
component: resolve(__dirname, 'pages/_catin/index.vue')
})
}
}
}

还有我的package.json

{
"name": "maimbau",
"version": "1.0.0",
"private": true,
"scripts": {
"dev": "nuxt --hostname 0.0.0.0 --port 8000",
"build": "nuxt build",
"start": "nuxt start",
"dev:local": "nuxt",
"analyze": "nuxt build --analyze",
"generate": "nuxt generate",
"lint:js": "eslint --ext ".js,.vue" --ignore-path .gitignore .",
"lint:style": "stylelint "**/*.{vue,css}" --ignore-path .gitignore",
"lint": "npm run lint:js && npm run lint:style"
},
"dependencies": {
"@nuxtjs/axios": "^5.13.6",
"aos": "^2.3.4",
"core-js": "^3.15.1",
"firebase": "^9.8.0",
"nuxt": "^2.15.8",
"swiper": "^5.4.5",
"vue-awesome-swiper": "^4.1.1",
"vue-sweetalert2": "^5.0.2",
"vue-tailwind-modal": "^1.0.7"
},
"devDependencies": {
"@babel/eslint-parser": "^7.14.7",
"@nuxtjs/eslint-config": "^6.0.1",
"@nuxtjs/eslint-module": "^3.0.2",
"@nuxtjs/stylelint-module": "^4.0.0",
"@nuxtjs/tailwindcss": "^4.2.1",
"eslint": "^7.29.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-nuxt": "^2.0.0",
"eslint-plugin-vue": "^7.12.1",
"postcss": "^8.3.5",
"prettier": "^2.3.2",
"stylelint": "^13.13.1",
"stylelint-config-prettier": "^8.0.2",
"stylelint-config-standard": "^22.0.0"
}
}

我在github中偶然发现了这个问题https://github.com/nuxt/vercel-builder/issues/633我只是在vercel.json中指定vercel生成器的版本来自:

{
"version": 2,
"builds": [
{
"src": "nuxt.config.js",
"use": "@nuxtjs/vercel-builder"
}
]
}

至:

{
"version": 2,
"builds": [
{
"src": "nuxt.config.js",
"use": "@nuxtjs/vercel-builder@0.21.3"
}
]
}

它的作用就像魅力!

最新更新