Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Correct usage with webpack #144

Open
matthias62 opened this issue Jan 7, 2018 · 3 comments
Open

Correct usage with webpack #144

matthias62 opened this issue Jan 7, 2018 · 3 comments

Comments

@matthias62
Copy link

When using with webpack I get the warning:

WARNING in .//angular-localforage//localforage/dist/localforage.js
Critical dependencies:
7:484-491 This seems to be a pre-built javascript file. Though this is possible,
it's not recommended. Try to require the original source to get better results.

I learnt, that this is not critical but it produces side effects when using with angular fullstack generator. The automatic reload of the application on code changes hangs when that warning occurs and I have to do a manual reload of the application.

To get rid of the warning I had to webpack's noParse property with the following path syntax (because I am on Windows):

    noParse: /[\/\\]node_modules[\/\\]localforage[\/\\]dist[\/\\]localforage\.js$/,

After that the warning disappears and the auto reload on code changes works but I don't like the Windows dependent path which will probably not work when building on Linux.

What is the recommended way to use angular-localForage with webpack to avoid such platform specific issues?

Best regards
Matthias

@scotttrinh
Copy link
Owner

@matthias62

I'm not a Webpack user, but I'll give you my best guess as to a solution: declare localForage as your own dependency and make it's source available for bundling.

If you're able to get it working in an elegant way, please let me know and I can add some documentation to the project to help others who might be in your same situation, or you're welcome to open an documentation PR!

@matthias62
Copy link
Author

@scotttrinh

Thank you but the guys at localForage do not recommend to use the original source. Furthermore I do not want to change the structure of the angular-localforage node package. I simply import now angular-localforage with:

import LocalForageModule from 'angular-localforage';

That automatically imports localforage as well. The only problem was the warning of webpack.

I now use the following solution in the webpack.make.js file of the angular fullstack generator. Seems to work on Windows and Linux. Maybe that helps others. Add the following noParse property to the module object in webpack.make.js

    /*
        Excludes the prebuild localforage library from parsing. Without that
        webpack produces a warning and the auto reolad of the app on code changes
        hangs and requires manual reloading.
        Two different path syntaxes for Windows and Linux build environments
    */
    noParse: [
        /[\/\\]node_modules[\/\\]localforage[\/\\]dist[\/\\]localforage\.js$/,
        /node_modules\/localforage\/dist\/localforage.js/
    ],

@matthias62
Copy link
Author

@scotttrinh

After checking the regular expressions in noParse I found that the first expression is already sufficient for both path syntax types on Windows and Linux. The second expression is henceforth redundant and can be removed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants