首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在node_modules中引用静态JS文件?

在Node.js项目中,你不能直接在node_modules文件夹中引用静态JS文件,因为node_modules文件夹是用来存放第三方库和模块的。但是,你可以在项目的根目录下创建一个public文件夹(如果没有的话),然后将静态JS文件放入该文件夹中。

要在Node.js项目中引用这些静态JS文件,你可以使用以下方法:

  1. 使用Express框架:

如果你的项目使用了Express框架,你可以使用express.static中间件来提供静态文件。首先,确保你已经安装了Express:

代码语言:javascript
复制
npm install express

然后,在你的app.js文件中添加以下代码:

代码语言:javascript
复制
const express = require('express');
const app = express();
const path = require('path');

// 设置静态文件夹
app.use(express.static(path.join(__dirname, 'public')));

// 其他路由和中间件...

// 启动服务器
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}`);
});

现在,你可以在public文件夹中放入你的静态JS文件,例如main.js。然后,在HTML文件中引用它:

代码语言:javascript
复制
<script src="/main.js"></script>
  1. 使用原生Node.js:

如果你没有使用Express框架,你可以使用原生Node.js的http模块和fs模块来提供静态文件。在你的主文件(例如server.js)中添加以下代码:

代码语言:javascript
复制
const http = require('http');
const fs = require('fs');
const path = require('path');

const server = http.createServer((req, res) => {
  const filePath = path.join(__dirname, 'public', req.url === '/' ? 'index.html' : req.url);
  const extname = String(path.extname(filePath)).toLowerCase();

  const mimeTypes = {
    '.html': 'text/html',
    '.js': 'text/javascript'
  };

  const contentType = mimeTypes[extname] || 'application/octet-stream';

  fs.readFile(filePath, (err, content) => {
    if (err) {
      res.writeHead(500);
      res.end(`Error: ${err.code}`);
    } else {
      res.writeHead(200, { 'Content-Type': contentType });
      res.end(content, 'utf-8');
    }
  });
});

const PORT = process.env.PORT || 3000;
server.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}`);
});

现在,你可以在public文件夹中放入你的静态JS文件,例如main.js。然后,在HTML文件中引用它:

代码语言:javascript
复制
<script src="/main.js"></script>
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券