I have a Laravel/Inertia.js/Svelte project where I'm importing a settings sass file based on the Zurb Foundation settings file in the svelte component:
<style lang="scss">
@import 'resources/sass/settings';
...
</style>
This settings file in turn imports sass files from the foundation-sites module (utils). Even though the import works fine, I get the following warning from Webpack:
WARNING in ./resources/js/academy/transactions/orders/Order.svelte
Invalid dependencies have been reported by plugins or loaders for this module. All reported dependencies need to be absolute paths.
Invalid dependencies may lead to broken watching and caching.
As best effort we try to convert all invalid values to absolute paths and converting globs into context
dependencies, but this is deprecated behavior.
Loaders: Pass absolute paths to this.addDependency (existing files), this.addMissingDependency (not existing files), and this.addContextDependency (directories).
Plugins: Pass absolute paths to fileDependencies (existing files), missingDependencies (not existing files), and contextDependencies (directories).
Globs: They are not supported. Pass absolute path to the directory as context dependencies.
The following invalid values have been reported:
* "C:/Program Files/Android/sdk/code/inertia/node_modules/foundation-sites/scss/util/_breakpoint.scss"
* "C:/Program Files/Android/sdk/code/inertia/node_modules/foundation-sites/scss/util/_color.scss"
* "C:/Program Files/Android/sdk/code/inertia/node_modules/foundation-sites/scss/util/_direction.scss"
* and more ...
The paths in the warning look to be absolute, so I'm unsure what to do to resolve the warning.
Any ideas how I can resolve the warnings?