project uses the tab feature, which in turn requires caching of page data. During local development, the cache can be cached normally, but after being packaged with webpack, the cache is found to be invalid when uploaded to the server, resulting in some business errors.
routing code:
module.exports = (file: string) => {
"use strict";
return () => import(`@/views/${file}`);
};
const getComponent = require(`./import_${process.env.NODE_ENV}`);
{
path: "/customers",
name: "Customers",
component: getComponent("customers/index"),
permission: true,
meta: { key: "Customers" },
children: [
{
path: "baseInfo",
name: "Base Info",
component: getComponent("customers/baseInfo/index"),
permission: true,
meta: { key: "BaseInfo" },
},
],
},Page Code:
import { Component, Vue } from "vue-property-decorator";
@Component
export default class Components extends Vue {
render() {
const { keepList } = this.$store.state.app;
return (
<keep-alive max={10} include={keepList}>
<router-view />
</keep-alive>
);
}
}