#javascript #webpack #es6-modules
Вопрос:
Я разрабатываю конкретный пакет npm, в котором я хочу иметь возможность импортировать различные помощники из базового пакета в синтаксисе ESM, например,
import {
myFunction,
myConstant
} from 'my-npm-package-library'
Это мой файл entrypoint index.ts:
// Interface CelestiaSkyViewerOptions:
export interface CelestiaSkyViewerOptions {
fullscreen?: boolean
showSolar?: boolean
showEcliptic?: boolean
showAsterisms?: boolean
showStars?: boolean
showConstellations?: boolean
showConstellationBoundaries?: boolean
showCardinalPoints?: boolean
showTimeAndCoordinateLocation?: boolean
showAstronomicalTime?: boolean
showCopyright?: boolean
}
// Export all default components:
export { default as CelestiaAstronomicalEpoch } from '@/components/CelestiaAstronomicalEpoch/CelestiaAstronomicalEpoch.vue'
export { default as CelestiaCopyright } from '@/components/CelestiaCopyright/CelestiaCopyright.vue'
export { default as CelestiaIAUStarKey } from '@/components/CelestiaIAUKeys/CelestiaIAUStarKey.vue'
export { default as CelestiaObserverLocale } from '@/components/CelestiaObserverLocale/CelestiaObserverLocale.vue'
export { default as CelestiaOrientationCompass } from '@/components/CelestiaOrientationCompass/CelestiaOrientationCompass.vue'
export { default as CelestiaOrientationPermission } from '@/components/CelestiaOrientationPermission/CelestiaOrientationPermission.vue'
export { default as CelestiaSkyViewer } from '@/components/CelestiaSkyViewer/CelestiaSkyViewer.vue'
export {
annotateBody,
drawBody,
drawClosedPath,
drawEllipticalGalaxy,
drawLine,
drawMoon,
drawSun,
drawText,
highlightBody,
resetPath
} from '@/composables/canvas'
export { azimuthalOffset } from '@/composables/celestia'
export { bayerStarsFilter, iauStarsFilter } from '@/composables/filters'
export {
cardinals,
coords,
latitude,
locatedAt,
longitude,
onEquatorialPositionChange,
position,
useObserversLocation,
validateLatitude,
validateLongitude
} from '@/composables/geolocation'
export { datetime } from '@/composables/globals'
export {
deviceOrientationPermissionDialogOpen,
deviceOrientationPermissionState,
isOrientationCompassOpen,
orientationCompassHeading,
useDeviceMotionPermission,
useDeviceOrientationPermission
} from '@/composables/orientation'
Однако при попытке зафиксировать этот код линтер при фиксации, который у меня есть, выдает следующую ошибку:
ReferenceError: module is not defined in ES module scope
Я пытался обойти эту конкретную ошибку в Google, но, похоже, никто не хочет играть в мяч с линтером…
Полная трассировка стека для любых любителей мусора:
ERROR ReferenceError: module is not defined in ES module scope
This file is being treated as an ES module because it has a '.js' file extension and '/Users/michael/observerly/celestia-vue/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
ReferenceError: module is not defined in ES module scope
This file is being treated as an ES module because it has a '.js' file extension and '/Users/michael/observerly/celestia-vue/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
Комментарии:
1. Это не похоже на ошибку линтера (сообщение), а скорее на ошибку во время выполнения. Где именно возникает эта ошибка? Поскольку ни один из опубликованных вами кодов не ссылается
module
на него, он определенно не брошен туда.2. @FelixKling Привет, Феликс, спасибо за твой комментарий. Он выбрасывается при запуске npm run lint ->, который, в свою очередь, вызывает vue-cli-service lint… Я добавлю к вопросу полную цепочку ошибок.
3. @FelixKling, я чувствую, что это может быть полезно: cli.vuejs.org/guide/build-targets.html#library
4. Или даже цели сборки веб-пакетов?
5. Похоже, что удаление
type: module
из моего пакета.json устранило ошибку…