При сборке приложения не удалось создать папку артефакта: «frontend/dist/». Убедитесь, что это свойство настроено правильно в файле рабочего процесса
Я пытаюсь развернуть монорепозиторий, состоящий из интерфейса React (Vite) и бэкэнда Node.js.
Проект разделен на папки Backend и Frontend. Когда мой рабочий процесс запускается, я получаю сообщение об ошибке: «При сборке приложения не удалось создать папку артефакта: 'frontend/dist/'».
Я попытался вручную собрать проект внешнего интерфейса, чтобы проверить, действительно ли он создал папку dist в моей папке внешнего интерфейса, и это произошло.
Что я делаю не так?
Это мой файл рабочего процесса:
name: Build and Deploy
on:
push:
branches:
- main
jobs:
build_and_deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v2
- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: "18.x"
- name: Install dependencies and build frontend
run: |
cd frontend
npm install
npm run build
- name: Log frontend directory contents
run: |
echo "Logging frontend directory contents"
ls -la ./frontend
echo "Logging frontend/dist directory contents"
ls -la ./frontend/dist
- name: Install dependencies for backend
run: |
cd backend
npm install
- name: Log backend directory contents
run: |
echo "Logging backend directory contents"
ls -la ./backend
- name: Deploy to Azure Static Web Apps
uses: Azure/static-web-apps-deploy@v1
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
repo_token: ${{ secrets.AZURE_TOKEN }}
action: "upload"
app_location: "./frontend" # The location of your application source code.
api_location: "backend" # The location of your API source code.
app_artifact_location: "frontend/dist/" # The location of your build output directory.
app_build_command: "npm run build"
api_build_command: "" # No build command for the backend
Я добавил это в свой vite.config.js файл:
export default defineConfig({
build: {
outDir: "dist",
chunkSizeWarningLimit: 1000, // Increase the chunk size limit to 1000 kB
manifest: true,
rollupOptions: {
// overwrite default .html entry
input: "/src/main.jsx",
},
// other build options
},
plugins: [react()],
});
Я попытался изменить app_artifact_location на следующее: "dist" "./dist", "dist/ и все равно ошибка.
Ответы 1
Рабочий процесс GitHub Actions не может найти ожидаемые артефакты сборки в указанном месте.
Конфигурация сборки статических веб-приложений Azure использует действия GitHub или конвейеры Azure. На каждом сайте есть файл конфигурации YAML, который контролирует создание и развертывание сайта. Этот MSDOC объясняет структуру и параметры файла.
В этом MSDOC статические веб-приложения Azure обеспечивают поддержку только интеграции API, будь то через управляемые функции Azure или путем использования собственных API, размещенных в других службах Azure.
Выполните следующие шаги для настройки статической веб-сети Azure с помощью git.
- После создания нового проекта Vite с использованием npm добавьте код для получения данных/сообщений из серверной части во внешнем интерфейсе.
App.vue: Приведенный ниже пример кода извлекает сообщение из API/серверной части и отображает его в пользовательском интерфейсе.
<template>
<div>
<h1>{{ message }}</h1>
</div>
</template>
<script>
import axios from 'axios';
export default {
data() {
return {
message: ''
};
},
created() {
axios.get('http://localhost:5000/api') /
.then(response => {
this.message = response.data.message;
})
.catch(error => {
console.error('There was an error fetching the data!', error);
});
}
};
</script>
<style scoped>
</style>
Я настроил backend/api, используя этот документ .
Добавьте Staticwebapp.config.json в корневой каталог внешнего интерфейса.
{
"navigationFallback": {
"rewrite": "index.html"
}
}
Структура папок Git Hub:
- Теперь измените git yml в соответствии со структурой вашей папки.
app_location to `./vite-project`,
api_location` to `./my-backend` ,
output_location to "dist"
Yml:
name: Azure Static Web Apps CI/CD
on:
push:
branches:
- main
pull_request:
types: [opened, synchronize, reopened, closed]
branches:
- main
jobs:
build_and_deploy_job:
if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
runs-on: ubuntu-latest
name: Build and Deploy Job
steps:
- uses: actions/checkout@v3
with:
submodules: true
lfs: false
- name: Build And Deploy
id: builddeploy
uses: Azure/static-web-apps-deploy@v1
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_WITTY_POND_06001940F }}
repo_token: ${{ secrets.GITHUB_TOKEN }}
action: "upload"
app_location: "./vite-project"
api_location: "./my-backend"
output_location: "dist"
close_pull_request_job:
if: github.event_name == 'pull_request' && github.event.action == 'closed'
runs-on: ubuntu-latest
name: Close Pull Request Job
steps:
- name: Close Pull Request
id: closepullrequest
uses: Azure/static-web-apps-deploy@v1
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_WITTY_POND_06001940F }}
action: "close"
Статус развертывания:
Статическое веб-приложение Azure:
Огромное спасибо. я очень ценю это