⚠️ Use alias Rollup plugin to omit full imports

- Define entries (utils, animations, etc) in the Rollup config in order to omit the whole back path (../../) when importing a file
- Global revoleExtensions in the config (to avoid duplicates)

src/animations/Carousel.js

@@ -1,6 +1,6 @@
 import anime from 'animejs'
 import ScrollOut from 'scroll-out'
-import { animDuration } from '../utils/store'
+import { animDuration } from 'utils/store'
 
 
 /*

src/animations/Locations.js

@@ -1,6 +1,6 @@
 import anime from 'animejs'
 import ScrollOut from 'scroll-out'
-import { animDuration } from '../utils/store'
+import { animDuration } from 'utils/store'
 
 
 /*

src/animations/Photo.js

@@ -1,8 +1,8 @@
 import anime from 'animejs'
 import ScrollOut from 'scroll-out'
 import imagesLoaded from 'imagesloaded'
-import { animDuration, animDurationLong } from '../utils/store'
-import { throttle, parallaxAnime } from '../utils/functions'
+import { animDuration, animDurationLong } from 'utils/store'
+import { throttle, parallaxAnime } from 'utils/functions'
 
 
 /*

src/animations/TitleSite.js

@@ -1,6 +1,6 @@
 import anime from 'animejs'
 import ScrollOut from 'scroll-out'
-import { animDuration } from '../utils/store'
+import { animDuration } from 'utils/store'
 
 
 /*

src/animations/Transition.js

@@ -1,5 +1,5 @@
 import anime from 'animejs'
-import { animDuration, animDurationLong } from '../utils/store'
+import { animDuration, animDurationLong } from 'utils/store'
 
 
 /*

src/animations/index.js

@@ -1,7 +1,7 @@
 import anime from 'animejs'
 import ScrollOut from 'scroll-out'
-import { animDuration } from '../utils/store'
-import { throttle, parallaxAnime } from '../utils/functions'
+import { animDuration } from 'utils/store'
+import { throttle, parallaxAnime } from 'utils/functions'
 
 
 /*

src/animations/page.js

@@ -1,6 +1,6 @@
 import anime from 'animejs'
 import ScrollOut from 'scroll-out'
-import { animDuration, animDurationLong } from '../utils/store'
+import { animDuration, animDurationLong } from 'utils/store'
 
 
 /*

src/animations/place.js

@@ -1,6 +1,6 @@
 import anime from 'animejs'
 // import ScrollOut from 'scroll-out'
-import { animDuration } from '../utils/store'
+import { animDuration } from 'utils/store'
 
 
 /*

src/animations/viewer.js

@@ -1,5 +1,5 @@
 import anime from 'animejs'
-import { animDuration } from '../utils/store'
+import { animDuration } from 'utils/store'
 
 
 /*

src/atoms/IconGlobe.svelte

@@ -1,6 +1,6 @@
 <script>
     import { stores } from '@sapper/app'
-    import { randomString } from '../utils/functions'
+    import { randomString } from 'utils/functions'
     const { page } = stores()
 
     // Props

src/atoms/IconGlobeSmall.svelte

@@ -1,6 +1,6 @@
 <script>
     import { stores } from '@sapper/app'
-    import { randomString } from '../utils/functions'
+    import { randomString } from 'utils/functions'
     const { page } = stores()
 
     // Props

src/atoms/TitleSite.svelte

@@ -1,9 +1,9 @@
 <script>
     import { onMount } from 'svelte'
-    import { charsToSpan } from '../utils/functions'
+    import { charsToSpan } from 'utils/functions'
 
     // Animations
-    import { animateIn } from '../animations/TitleSite'
+    import { animateIn } from 'animations/TitleSite'
 
     // Variables
     let scope

src/molecules/InteractiveGlobe.svelte

@@ -4,7 +4,7 @@
     // Lead 3: https://www.bypeople.com/css-js-webgl-rotating-3d-globe-effect/
 
     import { onMount } from 'svelte'
-    import { locations } from '../utils/store'
+    import { locations } from 'utils/store'
 
 
     // Props

src/molecules/Photo.svelte

@@ -1,10 +1,10 @@
 <script>
     import { onMount } from 'svelte'
-    import { site, currentLocation } from '../utils/store'
-    import { getThumbnail, formatDate } from '../utils/functions'
+    import { site, currentLocation } from 'utils/store'
+    import { getThumbnail, formatDate } from 'utils/functions'
 
     // Animations
-    import { animateIn } from '../animations/Photo'
+    import { animateIn } from 'animations/Photo'
 
     // Props and variables
     export let photo

src/molecules/Switcher.svelte

@@ -1,8 +1,8 @@
 <script>
-    import { currentLocation } from '../utils/store'
+    import { currentLocation } from 'utils/store'
 
     // Components
-    import IconGlobe from '../atoms/IconGlobe'
+    import IconGlobe from 'atoms/IconGlobe'
 
     // Props
     export let type = ''

src/organisms/Carousel.svelte

@@ -1,19 +1,19 @@
 <script>
     import { onMount, createEventDispatcher } from 'svelte'
     import { stores } from '@sapper/app'
-    import { currentLocation, fullscreen } from '../utils/store'
-    import { getThumbnail, formatDate } from '../utils/functions'
+    import { currentLocation, fullscreen } from 'utils/store'
+    import { getThumbnail, formatDate } from 'utils/functions'
 
     // Dependencies
     import SwipeListener from 'swipe-listener'
 
     // Animations
-    import { animateIn } from '../animations/Carousel'
+    import { animateIn } from 'animations/Carousel'
 
     // Components
-    import IconArrow from '../atoms/IconArrow'
-    import Counter from '../atoms/Counter'
-    import PaginationDots from '../molecules/PaginationDots'
+    import IconArrow from 'atoms/IconArrow'
+    import Counter from 'atoms/Counter'
+    import PaginationDots from 'molecules/PaginationDots'
 
     // Props
     export let photos

src/organisms/Footer.svelte

@@ -1,10 +1,10 @@
 <script>
     // Svelte
-    import { site, currentLocation } from '../utils/store'
+    import { site, currentLocation } from 'utils/store'
 
     // Components
-    import LinkTranslate from '../atoms/LinkTranslate'
-    import Switcher from '../molecules/Switcher'
+    import LinkTranslate from 'atoms/LinkTranslate'
+    import Switcher from 'molecules/Switcher'
 </script>
 
 <footer class="footer">

src/organisms/Fullscreen.svelte

@@ -1,13 +1,13 @@
 <script>
-    import { fullscreen } from '../utils/store'
-    import { throttle, getThumbnail } from '../utils/functions'
+    import { fullscreen } from 'utils/store'
+    import { throttle, getThumbnail } from 'utils/functions'
 
     // Dependencies
     import imagesLoaded from 'imagesloaded'
 
     // Components
-    import IconGlobe from '../atoms/IconGlobe'
-    import IconZoomOut from '../atoms/IconZoomOut'
+    import IconGlobe from 'atoms/IconGlobe'
+    import IconZoomOut from 'atoms/IconZoomOut'
 
     // Variables
     let scope

src/organisms/Locations.svelte

@@ -1,16 +1,16 @@
 <script>
     import { onMount } from 'svelte'
     import { flip } from 'svelte/animate'
-    import { receive, send } from '../animations/crossfade'
-    import { locations, countries, continents } from '../utils/store'
-    import { throttle } from '../utils/functions'
+    import { receive, send } from 'animations/crossfade'
+    import { locations, countries, continents } from 'utils/store'
+    import { throttle } from 'utils/functions'
 
     // Components
-    import Button from '../atoms/Button'
-    import Location from '../molecules/Location'
+    import Button from 'atoms/Button'
+    import Location from 'molecules/Location'
 
     // Animations
-    import { animateIn } from '../animations/Locations'
+    import { animateIn } from 'animations/Locations'
 
     // Variables
     const transitionDuration = 800

src/organisms/Pagination.svelte

@@ -1,6 +1,6 @@
 <script>
     import { onMount, createEventDispatcher } from 'svelte'
-    import { currentLocation } from '../utils/store'
+    import { currentLocation } from 'utils/store'
     const dispatch = createEventDispatcher()
 
     // Props

src/routes/_error.svelte

@@ -1,12 +1,12 @@
 <script>
-    import { site } from '../utils/store'
+    import { site } from 'utils/store'
 
     // Components
-    import IconArrow from '../atoms/IconArrow'
-    import TitleSite from '../atoms/TitleSite'
-    import Button from '../atoms/Button'
-    import InteractiveGlobe from '../molecules/InteractiveGlobe'
-    import Footer from '../organisms/Footer'
+    import IconArrow from 'atoms/IconArrow'
+    import TitleSite from 'atoms/TitleSite'
+    import Button from 'atoms/Button'
+    import InteractiveGlobe from 'molecules/InteractiveGlobe'
+    import Footer from 'organisms/Footer'
 
     // Props
     export let status

src/routes/_layout.svelte

@@ -1,5 +1,5 @@
 <script context="module">
-    import { apiEndpoints, } from '../utils/store'
+    import { apiEndpoints } from 'utils/store'
 
     export async function preload (page, session) {
         const req = await this.fetch(apiEndpoints.gql, {
@@ -71,11 +71,11 @@
         continents,
         countries,
         locations
-    } from '../utils/store'
+    } from 'utils/store'
 
     // Components
-    import Transition from '../utils/Transition'
-    import AnalyticsTracker from '../utils/AnalyticsTracker'
+    import Transition from 'utils/Transition'
+    import AnalyticsTracker from 'utils/AnalyticsTracker'
 
     // Variables
     const { page } = stores()

src/routes/choose.svelte

@@ -7,18 +7,18 @@
         currentPhotos,
         pageReady,
         pageTransition
-    } from '../utils/store'
+    } from 'utils/store'
 
     // Components
-    import IconArrow from '../atoms/IconArrow'
-    import TitleSite from '../atoms/TitleSite'
-    import Globe from '../molecules/InteractiveGlobe'
-    import Locations from '../organisms/Locations'
-    import Footer from '../organisms/Footer'
-    import SocialMetas from '../utils/SocialMetas'
+    import IconArrow from 'atoms/IconArrow'
+    import TitleSite from 'atoms/TitleSite'
+    import Globe from 'molecules/InteractiveGlobe'
+    import Locations from 'organisms/Locations'
+    import Footer from 'organisms/Footer'
+    import SocialMetas from 'utils/SocialMetas'
 
     // Animations
-    import { animateIn } from '../animations/page'
+    import { animateIn } from 'animations/page'
     pageTransition.onAnimationEnd = animateIn
 
     // Variables

src/routes/credits.svelte

@@ -1,18 +1,18 @@
 <script>
     import { onMount } from 'svelte'
     import { stores } from '@sapper/app'
-    import { site, pageReady, pageTransition } from '../utils/store'
+    import { site, pageReady, pageTransition } from 'utils/store'
 
     // Components
-    import IconArrow from '../atoms/IconArrow'
-    import TitleSite from '../atoms/TitleSite'
-    import LinkTranslate from '../atoms/LinkTranslate'
-    import InteractiveGlobe from '../molecules/InteractiveGlobe'
-    import Footer from '../organisms/Footer'
-    import SocialMetas from '../utils/SocialMetas'
+    import IconArrow from 'atoms/IconArrow'
+    import TitleSite from 'atoms/TitleSite'
+    import LinkTranslate from 'atoms/LinkTranslate'
+    import InteractiveGlobe from 'molecules/InteractiveGlobe'
+    import Footer from 'organisms/Footer'
+    import SocialMetas from 'utils/SocialMetas'
 
     // Animations
-    import { animateIn } from '../animations/page'
+    import { animateIn } from 'animations/page'
     pageTransition.onAnimationEnd = animateIn
 
     // Variables

src/routes/index.svelte

@@ -1,6 +1,4 @@
 <script context="module">
-	import { site, apiEndpoints } from '../utils/store'
-
     // Variables
     let limit
 
@@ -29,30 +27,32 @@
     import { onMount } from 'svelte'
     import { stores } from '@sapper/app'
     import {
+        apiEndpoints,
+        site,
         currentLocation,
         currentPhotos,
         pageReady,
         pageTransition
-    } from '../utils/store'
-    import { charsToSpan } from '../utils/functions'
+    } from 'utils/store'
+    import { charsToSpan } from 'utils/functions'
 
     // Dependencies
     import zenscroll from 'zenscroll'
 
     // Components
-    import Button from '../atoms/Button'
-    import IconGlobeSmall from '../atoms/IconGlobeSmall'
-    import IconGlobe from '../atoms/IconGlobe'
-    import InteractiveGlobe from '../molecules/InteractiveGlobe'
-    import Carousel from '../organisms/Carousel'
-    import Fullscreen from '../organisms/Fullscreen'
-    import Locations from '../organisms/Locations'
-    import Footer from '../organisms/Footer'
-    import SocialMetas from '../utils/SocialMetas'
-    import Transition from '../utils/Transition'
+    import Button from 'atoms/Button'
+    import IconGlobeSmall from 'atoms/IconGlobeSmall'
+    import IconGlobe from 'atoms/IconGlobe'
+    import InteractiveGlobe from 'molecules/InteractiveGlobe'
+    import Carousel from 'organisms/Carousel'
+    import Fullscreen from 'organisms/Fullscreen'
+    import Locations from 'organisms/Locations'
+    import Footer from 'organisms/Footer'
+    import SocialMetas from 'utils/SocialMetas'
+    import Transition from 'utils/Transition'
 
     // Animations
-    import { animateIn } from '../animations/index'
+    import { animateIn } from 'animations/index'
     pageTransition.onAnimationEnd = animateIn
 
     // Props and variables

src/routes/location/[country]/[place].svelte

@@ -1,5 +1,5 @@
 <script context="module">
-    import { apiEndpoints } from '../../../utils/store'
+    import { apiEndpoints } from 'utils/store'
 
     // Preload data
     export async function preload (page, session) {
@@ -30,25 +30,25 @@
         currentPhotos,
         pageReady,
         pageTransition
-    } from '../../../utils/store'
-    import { formatDate, relativeTime, getThumbnail } from '../../../utils/functions'
+    } from 'utils/store'
+    import { formatDate, relativeTime, getThumbnail } from 'utils/functions'
 
     // Dependencies
     import lazySizes from 'lazysizes'
 
     // Components
-    import IconGlobe from '../../../atoms/IconGlobe'
-    import IconGlobeSmall from '../../../atoms/IconGlobeSmall'
-    import LinkChange from '../../../atoms/LinkChange'
-    import ToggleLayout from '../../../atoms/ToggleLayout'
-    import Photo from '../../../molecules/Photo'
-    import Switcher from '../../../molecules/Switcher'
-    import Pagination from '../../../organisms/Pagination'
-    import Footer from '../../../organisms/Footer'
-    import SocialMetas from '../../../utils/SocialMetas'
+    import IconGlobe from 'atoms/IconGlobe'
+    import IconGlobeSmall from 'atoms/IconGlobeSmall'
+    import LinkChange from 'atoms/LinkChange'
+    import ToggleLayout from 'atoms/ToggleLayout'
+    import Photo from 'molecules/Photo'
+    import Switcher from 'molecules/Switcher'
+    import Pagination from 'organisms/Pagination'
+    import Footer from 'organisms/Footer'
+    import SocialMetas from 'utils/SocialMetas'
 
     // Animations
-    import { animateIn } from '../../../animations/place'
+    import { animateIn } from 'animations/place'
     pageTransition.onAnimationEnd = animateIn
 
     // Props and variables

src/routes/sitemap.xml.js

@@ -1,6 +1,6 @@
 const fs = require('fs')
 const fetch = require('node-fetch')
-import { apiEndpoints } from '../utils/store'
+import { apiEndpoints } from 'utils/store'
 
 
 // Variables

src/routes/viewer/[country]/[place]/[photo].svelte

@@ -1,7 +1,4 @@
 <script context="module">
-    import { stores } from '@sapper/app'
-    import { apiEndpoints } from '../../../../utils/store'
-
     // Define either to preload data or use the store
     let preloaded
     currentPhotos.subscribe(store => preloaded = store ? store : undefined)
@@ -31,25 +28,27 @@
 
 <script>
     import { onMount } from 'svelte'
+    import { stores } from '@sapper/app'
     import {
+        apiEndpoints,
         site,
         locations,
         currentLocation,
         currentPhotos,
         pageReady,
         pageTransition
-    } from '../../../../utils/store'
-    import { getThumbnail } from '../../../../utils/functions'
+    } from 'utils/store'
+    import { getThumbnail } from 'utils/functions'
 
     // Components
-    import IconGlobe from '../../../../atoms/IconGlobe'
-    import IconCross from '../../../../atoms/IconCross'
-    import Carousel from '../../../../organisms/Carousel'
-    import Fullscreen from '../../../../organisms/Fullscreen'
-    import SocialMetas from '../../../../utils/SocialMetas'
+    import IconGlobe from 'atoms/IconGlobe'
+    import IconCross from 'atoms/IconCross'
+    import Carousel from 'organisms/Carousel'
+    import Fullscreen from 'organisms/Fullscreen'
+    import SocialMetas from 'utils/SocialMetas'
 
     // Animations
-    import { animateIn } from '../../../../animations/viewer'
+    import { animateIn } from 'animations/viewer'
     pageTransition.onAnimationEnd = animateIn
 
     // Props

src/utils/AnalyticsTracker.svelte

@@ -1,5 +1,5 @@
 <script>
-    import { analyticsUpdate } from '../utils/functions'
+    import { analyticsUpdate } from 'utils/functions'
 
     // Props
     export let stores

src/utils/Transition.svelte

@@ -4,11 +4,11 @@
     const { page } = stores()
 
     // Components
-    import TitleSite from '../atoms/TitleSite'
-    import IconGlobe from '../atoms/IconGlobe'
+    import TitleSite from 'atoms/TitleSite'
+    import IconGlobe from 'atoms/IconGlobe'
 
     // Animations
-    import { animateIn, animateOut } from '../animations/Transition'
+    import { animateIn, animateOut } from 'animations/Transition'
 
 
     /*