我正在尝试将Typescript集成到现有的Next.js项目中,并收到此错误,目前尚不清楚它的语法错误。
$ tsc & PORT=3000 node --max-old-space-size=4096 server.ts
/Users/lassiter.gregg/code/candidco-web/lib/contentful/factory.ts:3
interface ContentfulAsset {
^^^^^^^^^^^^^^^
SyntaxError: Unexpected identifier
at Module._compile (internal/modules/cjs/loader.js:718:23)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:785:10)
at Module.load (internal/modules/cjs/loader.js:641:32)
at Function.Module._load (internal/modules/cjs/loader.js:556:12)
at Module.require (internal/modules/cjs/loader.js:681:19)
at require (internal/modules/cjs/helpers.js:16:16)
at Object.<anonymous> (/Users/lassiter.gregg/code/candidco-web/lib/contentful/fetchLandingPages.ts:1:16)
at Module._compile (internal/modules/cjs/loader.js:774:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:785:10)
at Module.load (internal/modules/cjs/loader.js:641:32)
at Function.Module._load (internal/modules/cjs/loader.js:556:12)
at Module.require (internal/modules/cjs/loader.js:681:19)
at require (internal/modules/cjs/helpers.js:16:16)
at Object.<anonymous> (/Users/lassiter.gregg/code/candidco-web/lib/contentful/index.ts:4:27)
at Module._compile (internal/modules/cjs/loader.js:774:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:785:10)
error Command failed with exit code 1.
我已经搜索并重构了它,它可以在其他项目中使用。我只是对为什么它会引发语法错误感到困惑。
这是/fetchlandingpages.ts
const assets = require('./factory.ts').ContentfulAssetFactory;
const lps = require('./factory.ts').LandingPageFactory;
const client = require('./client');
const LANDING_PAGE_CONTENT_TYPE_ID = 'campaignLandingPage';
module.exports = async () => {
const entries = await client.getEntries({
content_type: LANDING_PAGE_CONTENT_TYPE_ID,
});
const linkedAssets = await entries.includes.Asset.map((asset) =>
assets.create(asset.fields)
);
const items = entries.items.map((item) =>
lps.create(item.fields, linkedAssets)
);
return items;
};
这是有内容的/index.ts
const contentfulClient = require('./client');
const fetchArticles = require('./fetchArticles');
const fetchLegal = require('./fetchLegal');
const fetchLandingPages = require('./fetchLandingPages.ts');
module.exports = {
contentfulClient,
fetchArticles,
fetchLegal,
fetchLandingPages,
};
这是factory.ts:
interface ContentfulAsset {
id: string;
contentType: string;
url: string;
title: string;
}
class ContentfulAssetFactory {
static create(asset: ContentfulAsset) {
return {
id: asset.id,
contentType: asset.contentType,
url: asset.url,
title: asset.title
}
}
}
interface LandingPage {
campaignTitle: string;
promoCode: string;
template: string;
pageImages: Array<ContentfulAsset> | null;
ctaPrimary: Object;
ctaPrimaryButtonText: string;
ctaPrimaryHyperlink: string;
ctaAlt1: Object;
ctaAlt1Hyperlink: string;
ctaAlt1TextColor: string;
ctaAlt1BackgroundColor: string;
}
class LandingPageFactory {
static create(page: LandingPage, assets: Array<ContentfulAsset>) {
// const pageImgs = page.pageImages.map(asset => {
// assets.find(item => {
// if (item.sys.id === asset.sys.id) {
// }
// })
// })
const lp = {
campaignTitle: page.campaignTitle,
promoCode: page.promoCode,
template: page.template,
ctaPrimary: page.ctaPrimary,
ctaPrimaryButtonText: page.ctaPrimaryButtonText,
ctaPrimaryHyperlink: page.ctaPrimaryHyperlink,
ctaAlt1: page.ctaAlt1,
ctaAlt1Hyperlink: page.ctaAlt1Hyperlink,
ctaAlt1TextColor: page.ctaAlt1TextColor,
ctaAlt1BackgroundColor: page.ctaAlt1BackgroundColor,
pageImages: assets
}
return lp
}
}
export {
ContentfulAsset,
ContentfulAssetFactory,
LandingPage,
LandingPageFactory
}
我不希望出现语法错误。