要在html中使用node_modules中的多个文件，我发现最好的方法是将它们放入一个数组，然后循环它们，使它们对web客户端可见，例如使用node_modules中的filepond模块:

const filePondModules = ['filepond-plugin-file-encode', 'filepond-plugin-image-preview', 'filepond-plugin-image-resize', 'filepond']
filePondModules.forEach(currentModule => {
    let module_dir = require.resolve(currentModule)
                           .match(/.*\/node_modules\/[^/]+\//)[0];
    app.use('/' + currentModule, express.static(module_dir + 'dist/'));
})

然后在html(或布局)文件中，像这样调用它们:

    <link rel="stylesheet" href="/filepond/filepond.css">
    <link rel="stylesheet" href="/filepond-plugin-image-preview/filepond-plugin-image-preview.css">
...
    <script src="/filepond-plugin-image-preview/filepond-plugin-image-preview.js" ></script>
    <script src="/filepond-plugin-file-encode/filepond-plugin-file-encode.js"></script>
    <script src="/filepond-plugin-image-resize/filepond-plugin-image-resize.js"></script>
    <script src="/filepond/filepond.js"></script>

如果你想要一个快速简单的解决方案(并且你已经安装了gulp)。

在gulpfile.js中，我运行了一个简单的复制粘贴任务，将我可能需要的任何文件放到。/public/modules/目录中。

gulp.task('modules', function() {
    sources = [
      './node_modules/prismjs/prism.js',
      './node_modules/prismjs/themes/prism-dark.css',
    ]
    gulp.src( sources ).pipe(gulp.dest('./public/modules/'));
});

gulp.task('copy-modules', ['modules']);

这样做的缺点是它不是自动化的。然而，如果你所需要的只是复制一些脚本和样式(并保存在一个列表中)，这应该可以完成工作。

通常，您不希望向外部世界公开任何关于服务器结构的内部路径。你所能做的就是在服务器中创建一个/scripts静态路由，从文件所在的目录中获取文件。如果你的文件在"。/node_modules/bootstrap/dist/"目录下。然后，页面中的script标签看起来就像这样:

<script src="/scripts/bootstrap.min.js"></script>

如果你在nodejs中使用express，静态路由就像这样简单:

app.use('/scripts', express.static(__dirname + '/node_modules/bootstrap/dist/'));

然后，任何来自/scripts/xxx.js的浏览器请求都会自动从dist目录__dirname + /node_modules/bootstrap/dist/xxx.js中获取。

Note: Newer versions of NPM put more things at the top level, not nested so deep so if you are using a newer version of NPM, then the path names will be different than indicated in the OP's question and in the current answer. But, the concept is still the same. You find out where the files are physically located on your server drive and you make an app.use() with express.static() to make a pseudo-path to those files so you aren't exposing the actual server file system organization to the client.

如果你不想创建这样的静态路由，那么你最好将公共脚本复制到你的web服务器将其视为/scripts或任何你想使用的顶级名称的路径。通常，您可以将此复制作为构建/部署过程的一部分。

如果你想在一个目录中只公开一个特定的文件，而不是在该目录中找到的所有文件，那么你可以手动为每个文件创建单独的路由，而不是使用express.static()，例如:

<script src="/bootstrap.min.js"></script>

还有为它创建路径的代码

app.get('/bootstrap.min.js', function(req, res) {
    res.sendFile(__dirname + '/node_modules/bootstrap/dist/bootstrap.min.js');
});

或者，如果你仍然想用/scripts描述脚本的路由，你可以这样做:

<script src="/scripts/bootstrap.min.js"></script>

还有为它创建路径的代码

app.get('/scripts/bootstrap.min.js', function(req, res) {
    res.sendFile(__dirname + '/node_modules/bootstrap/dist/bootstrap.min.js');
});

要在html中使用node_modules中的多个文件，我发现最好的方法是将它们放入一个数组，然后循环它们，使它们对web客户端可见，例如使用node_modules中的filepond模块:

const filePondModules = ['filepond-plugin-file-encode', 'filepond-plugin-image-preview', 'filepond-plugin-image-resize', 'filepond']
filePondModules.forEach(currentModule => {
    let module_dir = require.resolve(currentModule)
                           .match(/.*\/node_modules\/[^/]+\//)[0];
    app.use('/' + currentModule, express.static(module_dir + 'dist/'));
})

然后在html(或布局)文件中，像这样调用它们:

    <link rel="stylesheet" href="/filepond/filepond.css">
    <link rel="stylesheet" href="/filepond-plugin-image-preview/filepond-plugin-image-preview.css">
...
    <script src="/filepond-plugin-image-preview/filepond-plugin-image-preview.js" ></script>
    <script src="/filepond-plugin-file-encode/filepond-plugin-file-encode.js"></script>
    <script src="/filepond-plugin-image-resize/filepond-plugin-image-resize.js"></script>
    <script src="/filepond/filepond.js"></script>

我想用一个更简单的解决方案来更新这个问题。创建到node_modules的符号链接。

授予node_modules公共访问权的最简单方法是从公共目录中创建一个指向node_modules的符号链接。符号链接将使文件存在于创建链接的任何地方。

例如，如果节点服务器有提供静态文件的代码

app.use(serveStatic(path.join(__dirname, 'dist')));

而__dirname指向/path/to/app，这样你的静态文件就会从/path/to/app/dist

node_modules位于/path/to/app/node_modules，然后在mac/linux上创建一个这样的符号链接:

ln -s /path/to/app/node_modules /path/to/app/dist/node_modules

或者像这样在窗户上:

mklink /path/to/app/node_modules /path/to/app/dist/node_modules

现在一个get请求:

node_modules/some/path 

是否会收到文件的响应

/path/to/app/dist/node_modules/some/path 

哪个才是真正的文件

/path/to/app/node_modules/some/path

如果你在/path/to/app/dist的目录不是一个安全的位置，可能是因为gulp或grunt构建过程的干扰，那么你可以为链接添加一个单独的目录，并添加一个新的serveStatic调用，例如:

ln -s /path/to/app/node_modules /path/to/app/newDirectoryName/node_modules

在节点中添加:

app.use(serveStatic(path.join(__dirname, 'newDirectoryName')));

我会使用path npm模块，然后做这样的事情:

var path = require('path');
app.use('/scripts', express.static(path.join(__dirname, 'node_modules/bootstrap/dist')));

重点:我们使用路径。使用系统不可知的方式使路径连接，即在Windows和Unix中，我们有不同的路径分隔符(/和\)