ubuntu 20.04
I use Vue for front-end development and vite as a packaging tool. In vite config.js, I have configured several agents, and everything is normal in the development environment.
export default ({
command,
mode
}) => {
...
return {
...
server: {
open: true,
port: process.env.VITE_CLI_PORT,
proxy: {
[process.env.VITE_BASE_API]: {
target: `${process.env.VITE_BASE_PATH}:${process.env.VITE_SERVER_PORT}/`,
changeOrigin: true,
rewrite: path => path.replace(new RegExp('^' + process.env.VITE_BASE_API), ''),
},
[process.env.ANTARES_BASE_API]: {
target: `${process.env.ANTARES_BASE_PATH}:${process.env.ANTARES_PORT}/`,
changeOrigin: true,
},
[process.env.ANTARES_QUERY_API]: {
target: `${process.env.ANTARES_BASE_PATH}:${process.env.ANTARES_PORT}/`,
changeOrigin: true,
},
},
},
...
}
}
.env.production
ENV = 'production'
VITE_CLI_PORT = 8080
VITE_SERVER_PORT = 8888
VITE_BASE_API = /api
VITE_BASE_PATH = http://127.0.0.1
ANTARES_PORT = 3000
ANTARES_BASE_API = /postgres/public
ANTARES_QUERY_API = /_QUERIES/script/
ANTARES_BASE_PATH = http://192.168.2.58
However, when docker builds the production environment, it will generate an error, so that I can't get the normal interface return
gin-vue-admin-vendor.1639807267000.js:1 TypeError: e.reduce is not a function
at Proxy.render (gin-vue-admin-vendor.1639807267000.js:15)
at Zt (gin-vue-admin-vendor.1639807267000.js:1)
at xe.i [as fn] (gin-vue-admin-vendor.1639807267000.js:1)
at xe.run (gin-vue-admin-vendor.1639807267000.js:1)
at D (gin-vue-admin-vendor.1639807267000.js:1)
at B (gin-vue-admin-vendor.1639807267000.js:1)
at v (gin-vue-admin-vendor.1639807267000.js:1)
at A (gin-vue-admin-vendor.1639807267000.js:1)
at E (gin-vue-admin-vendor.1639807267000.js:1)
at _ (gin-vue-admin-vendor.1639807267000.js:1)
(anonymous) @ gin-vue-admin-vendor.1639807267000.js:1
package.json
{
"name": "gin-vue-admin",
"version": "2.4.6",
"private": true,
"scripts": {
"serve": "node openDocument.js && vite --host --mode development",
"build": "vite build --mode production",
"limit-build": "npm install increase-memory-limit-fixbug cross-env -g && npm run fix-memory-limit && node ./limit && npm run build",
"preview": "vite preview",
"fix-memory-limit": "cross-env LIMIT=4096 increase-memory-limit"
},
"dependencies": {
"@element-plus/icons": "0.0.11",
"axios": "^0.19.2",
"core-js": "^3.6.5",
"echarts": "4.9.0",
"element-plus": "^1.2.0-beta.5",
"highlight.js": "^10.6.0",
"marked": "^2.0.0",
"mitt": "^3.0.0",
"path": "^0.12.7",
"qs": "^6.8.0",
"quill": "^1.3.7",
"screenfull": "^5.0.2",
"script-ext-html-webpack-plugin": "^2.1.4",
"spark-md5": "^3.0.1",
"vue": "^3.2.25",
"vue-particle-line": "^0.1.4",
"vue-router": "^4.0.0-0",
"vuex": "^4.0.0-0",
"vuex-persist": "^2.1.0"
},
"devDependencies": {
"@vitejs/plugin-legacy": "^1.4.4",
"@vitejs/plugin-vue": "latest",
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
"@vue/cli-plugin-vuex": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.1.5",
"babel-eslint": "^10.1.0",
"babel-plugin-import": "^1.13.3",
"chalk": "^4.1.2",
"dotenv": "^10.0.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0",
"sass": "^1.26.5",
"sass-loader": "^8.0.2",
"vite": "2.5.10",
"vite-plugin-banner": "^0.1.3",
"vite-plugin-importer": "^0.2.5"
}
}
dockerfile
FROM node:12.16.1
WORKDIR /web/
COPY . .
RUN npm install
RUN npm run build
FROM nginx:alpine
COPY .docker-compose/nginx/conf.d/my.conf /etc/nginx/conf.d/my.conf
COPY --from=0 /web/dist /usr/share/nginx/html
RUN cat /etc/nginx/nginx.conf
RUN cat /etc/nginx/conf.d/my.conf
RUN ls -al /usr/share/nginx/html
I really don't know how to solve it