Vue3 应用程序在 Netlify 上部署后无法运行

Question

我一直在研究 Ryan Balieiro 的 foxy-template vue 应用程序并对其进行了一些定制。

在更改了

public/data

文件夹中的一些内容并在存储库的公共文件夹中添加了包含

_redirects

的

/* /index.html 200

文件后，我尝试从 Netlify 的 Web 界面部署它。

更具体地说，我通过提供以下配置从 Github 部署它：

.

我的

package.json

看起来像这样：

{
  "name": "agency-template",
  "private": true,
  "version": "1.0.3",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "deploy": "cd dist && cp index.html 404.html"
  },
  "dependencies": {
    // ...
    "vue": "^3.2.47",
    "vue-router": "^4.2.4"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.1.0",
    "sass": "^1.62.1",
    "vite": "^4.3.2"
  }
}

遗憾的是，在尝试导航到

https://some-cool-name.netlify.app/portfolio

后，我收到错误和空白页面：

我的

vite.config.js

看起来像这样：

// imports

export default defineConfig({
  base: '/portfolio',
  plugins: [vue()],
})

并且

router.js

与模板中的一样：

// ...

const data = useData()

export function createAppRouter() {
    const routeList = [
        {
            path: "/",
            name: "home",
            component: HomePage,
            label: "Home",
            faIcon: "fa-solid fa-home"
        },

        {
            path: "/policy",
            name: "policy",
            component: SecondaryPage,
            label: "Privacy Policy",
            faIcon: "fa-solid fa-hammer",
            props: {contentData: data.getPolicyData()}
        },

        {
            path: "/license",
            name: "license",
            component: SecondaryPage,
            label: "License",
            faIcon: "fa-solid fa-copy",
            props: {contentData: data.getLegalData()}
        },

        {
            path: "/:pathMatch(.*)*",
            redirect: "/"
        }
    ]

    return createRouter({
        history: createWebHistory(import.meta.env.BASE_URL),
        routes: routeList,
    })
}

使用版本：

"vue": "^3.2.47",
"vue-router": "^4.2.4"
"vite": "^4.3.2"

我已经尝试了不同的部署过程（netlify 的 CLI 和手动部署 dist 文件夹），但没有任何变化。

我还尝试将

vite.config.js

中应用程序的基本目录留空，但它似乎无法在本地工作。

Answer 1

我也有同样的错误。能修好吗？