Сформировать страницу Контакты

Завершена
Планируемый запуск: 24.04.2021Дата начала: 24.04.2021Планируемое завершение: 24.04.2021Дата завершения: 24.04.2021
ПроектЗадачаСтатусДата постановкиНачалоКонецКто создал
Пивная картаСформировать страницу КонтактыЗавершена24.04.2021 04:33:1224.04.2021 14:25:3824.04.2021 14:54:44
Пивная картаСформировать страницу КонтактыЗавершена24.04.2021 04:33:1224.04.2021 04:47:3824.04.2021 05:45:55
Николай, приветствую!
Нужна помощь и в этом вопросе)

1. Сюда /home/dima/docker/docker-pivkarta/prisma-cms/pivkarta.ru-2/pages/contacts/index.ts
добавил
export { default } from 'src/pages/Contacts'

2. /home/dima/docker/docker-pivkarta/prisma-cms/pivkarta.ru-2/src/pages/Contacts/index.ts завел

import { NextSeo } from 'next-seo' import React from 'react' import { Page } from '../_App/interfaces' import ContactsPageView from './View' /** * Страница контактов */ const ContactsPage: Page = () => { return ( <NextSeo title="Контакты" description="Контакты Пивной карты" /> <ContactsPageView /> ) } export default ContactsPage


3. Добавил /home/dima/docker/docker-pivkarta/prisma-cms/pivkarta.ru-2/src/pages/Contacts/View/index.ts

import React, { useMemo } from 'react' //import Grid from '@material-ui/core/Grid' //import { CitiesPageViewProps } from './interfaces' //import CityLink from 'src/components/ui/Link/City' const СontactsPageView: React.FC<> = () => { //return useMemo(() => { return ( <h1>Контакты</h1> ) //}, []) } export default ContactsPageView

Получил ошибки:
/src/pages/Contacts/index.ts:17:12 Syntax error: Unexpected token, expected "," 15 | 16 | <NextSeo > 17 | title="Контакты" | ^ 18 | description="Контакты Пивной карты" 19 | /> 20 |


Убираю этот тег - ругется также на <ContactsPageView />

Комменчу return () и ставлю return "1" - отдаётстраницу c 1 на url /contacts

Посмотришь по возможности?
Дима, привет!
Замени .ts на .tsx
Это как раньше для файлов с реактом расширения указывали не .js, а .jsx, потому что там не чистый JS-код, а плюс и реактовая разметка (HTML-теги). Вот парсер и не может понять, что у тебя в JS-коде за непонятные примеси.

Спасибо! Всё оказалось просто
Я закоммитил, но что-то там типом Page во вьюхе пождозрительное: он вообще что делает?
И гитхаб ругается https://github.com/Pivkarta/pivkarta.ru-2/actions/runs/780734838
Гитхаб тебе ругается вполне конкретно:

./src/pages/Contacts/View/index.tsx:2:22
Type error: Cannot find module '../_App/interfaces' or its corresponding type declarations.


Ты разве в IDE своей не видишь той же самой ошибки во вьюхе?

К тому же ты можешь выполнить (и перед коммитом должен выполнять, по-хорошему) yarn types и увидел бы ошибку.
Признавайся, выкатывал git push --no-verify?
Признавайся, выкатывал git push --no-verify? -- Неа! git push origin master
Нельзя просто так взять и выкатить коммит с ошибкой. Там хуки прописаны. На пуш выполняется yarn types, то есть проверка типов. Вот смотри:


Только вдруг если у тебя husky вдруг не установилось, или вдруг хуки выпилил (хотя я сомневаюсь), или ты глобально "поправил багу", как-то запретив хуки в гите.
Еще раз:
1. yarn types у тебя что показывает?
2. В IDE ты не видишь ошибку в той вьюхе?
yarn types
-------------------
src/pages/Contacts/View/index.tsx:2:22 - error TS2307: Cannot find module '../_App/interfaces' or its corresponding type declarations.

2 import { Page } from '../_App/interfaces'
~~~~~~~~~~~~~~~~~~~~


Found 1 error.

error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

А в IDE вроде норм.

Тип Page вроде есть, его ему не нравится?
Вот в src/pages/Contacts/View/index.tsx норм?
У меня не норм.

В общем, у тебя путь битый, ссылается на несуществующий файл (потому что ты это скопировал из файла другой страницы другой вложенности). В твоем случае правильный путь import { Page } from '../../_App/interfaces'

Но, в данном компоненте тип Page тебе вообще не нужен. Это для корневых компонентов страниц, а не вложенных. То есть в целом работать будет, если путь поправить, но будут на вход параметры, которые особо и не нужны там.


Плюс у самого компонента появляются методы, которые в данном случае не нужны.


Сам по себе тип Page - это расширенный тип некстового типа Page, который задает свойства для страниц роутинга, это которые в /pages прописываются.


Тебе же во вьюхе нужен просто React.FC (Function Component)

Понял, спасибо огромное!
Изменил во вьюхе тип Page на React.FC.
Проверил yarn types и закоммитил.

Как бы ещё понять, что это за тит такой и когда его использовать?

Добавить комментарий