简体   繁体   中英

Ignore variable dependency of node_module webpack

I have built a library that I want to use in a Next.JS project. Within this library a certain dependency is using an import via a string passed into a require statement within the source code where the import is taking place. This is causing webpack to not recognize the import. I don't want to change code within any node_modules as this is not a preferred approach but how can I ensure that my project using the library I built is able to compile and run?

Within file_using_string_passed_into_require_to_get_import.js:

let importName = "./potential_import_A.js"
if(condition){
importName = "./potential_import_B.js"
}
module.exports = require(importName)

This is the folder structure:

Project/
    | node_modules
      | my-library
        | node_modules
          | library-dependency
             | file_using_string_passed_into_require_to_get_import.js
             | potential_import_A.js
             | potential_import_B.js

To create a local (unpublished) library package

  • Create a 'my-library' folder (outside your current project dir).
  • Do npm init (Folder must include the 'package.json' )
  • Include source code (potential_import_A), exporting any desired functions.

In the actual project folder:

  • cd into the folder of the project that needs to use your library.
  • Run npm install --save local/path/to/my-library .
  • The --save will add the package to your dependencies in the project's package.json file, as it does with 3rd party published packages. It will also add a copy of the source code to the node modules folder of the project, as always.

Importing your new library:

  • import/require the package as you would normally, from any project.
    For example
    import { myFunction } from "my-library"

I got it to work by excluding node_modules from the webpack build. Since I am using Next.JS this is within my next.config.js

const nodeExternals = require('webpack-node-externals');

module.exports = {
  webpack: (
    config,
    {
      buildId, dev, isServer, defaultLoaders, nextRuntime, webpack,
    },
  ) => {
    if (isServer) {
      config.target = 'node';

      config.node = {
        __dirname: true,
        global: true,
        __filename: true,
      };

      config.externals = [nodeExternals()], // in order to ignore all modules in node_modules folder
      config.externalsPresets = {
        node: true, // in order to ignore built-in modules like path, fs, etc.
      };
    }

    return config;
  },
};

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM