为啥npm start启动不了服务器

Posted 2023-03-23

NPM start 需要在package.json中定义，运行命令需要在nodejs环境下运行。

E:\\workSpace\\nodejs\\helloworld>npm start

> helloworld@0.0.0 start E:\\workSpace\\nodejs\\helloworld

> node ./bin/www

GET / 304 564.566 ms - -

GET /stylesheets/style.css 304 2.819 ms - -

如何利用NPM包管理工具中的命令操作：

1、第一步，查看npm有关的命令，可以使用npm h，如下图所示：

2、第二步，查看对包的控制权限，可以使用npm access，如下图所示：

3、第三步，如果添加用户相关信息，可以使用npm add-user，如下图所示：

4、第四步，查看api帮助文档，使用命令npm apihelp，如下图所示：

5、第五步，查看作者或创建人，使用npm author命令，如下图所示：

6、第六步，查看npm安装的可执行文件路径，使用npm bin命令，如下图所示：

参考技术A 一、写在前面 人人都想成为全栈码农，作为一个web前端开发人员，通往全栈的简洁之路，貌似就是node/dist/v0.6.1/node-v0.6.1.msi 下载电脑适配的安装包（这个是windows的，买不起mac啊），然后根据引导安装就可以了，默认安装在C:\Program Files\nodejs文件下，并将该目录添加进PATH环境变量。具体做法，右击”我的电脑“-”属性“-“系统高级”-”高级“-”环境变量“-选择“变量名：PATH”；“改变量值：在最后面添加【C:\Program Files\nodejs】（根据自己的安装目录而定）”。打开cmd直接运行命令： node -v 可以输出当前版本号。node文件里已经集成了npm，之后使用npm install XXX 来安装需要的插件或者模块。 三、使用express框架 忙活了一阵，终于可用npm命令进行初始化、安装express框架，然后写个hello world 爽一下了。为什么要选择express框架了，当然有它的特别之处，对新手来说最怕的就是麻烦还容易出错。express当然为我们考虑到了，所以提供了快速生成器：express-generator 1、通过命令：npm install express-generator -g 安装到全局 2、在用express 命令生成项目结构 express myapp 其中的myapp是你的项目名称 3、通过cd myapp 进入项目文件中 通过npm install 初始化依赖模块 通过set DEBUG=myapp & npm start 启动web服务器 4、在浏览器中打开 localhost:3000/ 网址就可以看到这个应用了。 默认情况下用的模版引擎是jade，项目里也已经配置好了这个模版。 四、介绍express 生成器的项目 1、myapp项目的机构如下： 2、package.json 这个可以说是模块管理包，项目信息和模块的版本号，其实你会发现在项目模块初始化的时候就是由这里的配置去查找生成的。 3、app.js 是项目的启动文件，可以说是项目的核心。主要写一些公共的功能。 4、bin 文件下有个无后缀的www文件，这是项目的入口文件，配置web服务端口和一些监听事件。 5、node_modules是项目的依赖的的文件模块，之后导入的包也会被放在其中，比如连接数据库的mongoose模块，后面会详细讲。 6、public 是项目的静态资源文件集，很容易看出图片、css文件、js文件都放在这里。 7、routes 是项目的路由模块，其中已经默认了index.js和user.js文件。在这里其实也包括一般后台语言中的控制器内容，当然在大的项目上是可以分离开来的。 8、views是项目的模版文件，是jade模版引擎，这个模版很简洁，但是坑也比较多，比如对空格的要求都非常严格，多一个少一个空格都会报错的，曾经踩过很多坑，其实它的性能也不是很高还不如用ejs呢。 五、安装mongoDB 1、同样在官网(/downloads)上直接下载msi文件 2、简单的下一步进行安装，有默认的就让其默认，有选择的就全选了 3、然后配置环境变量，和node的一样不再累述，不过可以放中图，哈哈哈…… 4、接下来是启动mongoDB服务 5、通过命令：mongod --dbpath f:\MongoDB\data 其中 f:\MongoDB\data是文件存放路径，看到如下信息说明成功了 6、MongoDB监听的是27017端口，同时打开浏览器输入127.0.0.1:27017，则会看到如下提示： 　　It looks like you are trying to access MongoDB over HTTP on the native driver port. 7、然后，再打开一个cmd，输入mongo命令链接数据库，出现如下提示： 　　2015-05-02T17:10:19.467+0800 I CONTROL Hotfix KB2731284 or later update is not installed, will zero-out data files MongoDB shell version: 3.0.2 connecting to: test 8、这样windows环境下的monogDB就安装成功了。 补充： 9、如果你嫌每次用命令打开服务麻烦的话，可以写成批处理文件，就是新建一个后缀.bat的文件，写上如下代码： 　　start mongod --dbpath F:\MongoDB\data 10、当然了，你也可以将MongoDB以服务的方式启动，不过我觉得在学习的过程中用处不大，小伙伴们可以自己尝试一下，如果有需要的话，我在后面会补上。 11、要是觉得命令行不好用，推荐一个带图形化界面的软件：MongoVUE，就和navicat差不多，它有免费版的，就是功能少点，但学习过程中完全足够了 六、在node项目中使用monogDB 1、导入monogDB连接模块，express 官方介绍的是mongoskin模块，这个我就不说了，这里介绍通过mongoose安装 2、在myapp项目下执行命令 npm install mongoose -save 安装保存到node_modules，也可以在package.json中配置"mongoose": "^4.4.12",然后命令npm install 安装。 3、在app.js文件中 　a、导入mongoose模块： var mongoose = require('mongoose'); b、创建数据库连接 mongoose.connect('mongodb://localhost/myDB') //连接本地数据库 4、在项目根目录下新建文件夹schemas，这个是数据集模块，在模块下新建users.js文件 var mongoose = require('mongoose'); //申明一个mongoons对象 var UsersSchema = new mongoose.Schema( name: String, paw: String, meta: createAt: type: Date, default: Date.now() , updateAt: type: Date, default: Date.now() ) //每次执行都会调用,时间更新操作 UsersSchema.pre('save', function(next) if(this.isNew) this.meta.createAt = this.meta.updateAt = Date.now(); else this.meta.updateAt = Date.now(); next(); ) //查询的静态方法 UsersSchema.statics = fetch: function(cb) //查询所有数据 return this .find() .sort('meta.updateAt') //排序 .exec(cb) //回调 , findById: function(id, cb) //根据id查询单条数据 return this .findOne(_id: id) .exec(cb) //暴露出去的方法 module.exports = UsersSchema 5、在根目录新增modules文件，这个是数据模型模块，在模块下新增users.js文件 var mongoose = require('mongoose') var UsersSchema = require('../schemas/users') //拿到导出的数据集模块 var Users = mongoose.model('Users', UsersSchema) // 编译生成Movie 模型 module.exports = Users 6、在routes文件中的users.js文件中添加路由控制器代码 var express = require('express'); var mongoose = require('mongoose');//导入mongoose模块 var Users = require('../models/users');//导入模型数据模块 var router = express.Router(); /* GET users listing. */ router.get('/', function(req, res, next) res.send('respond with a resource'); ); //查询所有用户数据 router.get('/users', function(req, res, next) Users.fetch(function(err, users) if(err) console.log(err); res.render('users',title: '用户列表', users: users) //这里也可以json的格式直接返回数据res.json(data: users); ) ) module.exports = router; 7、在views文件下新增users.jade extends layout block content h1= title //jade取值方式 ul each user in users //jade模版的遍历方式 li h4 #user.name span #user.paw 8、最后在浏览器中打开网址：localhost:3000/users/users，查看效果。到这里一个从数据库到前端展现的项目就完成了。 以上就是本文的全部内容，希望对大家的学习有所帮助。

NPM Start 未启动本地服务器

【中文标题】NPM Start 未启动本地服务器

【英文标题】：NPM Start not starting local server

【发布时间】：2017-03-21 14:08:29

【问题描述】：

我正在尝试使用 webpack 制作一个 react 应用程序，当我尝试运行 npm start 时，它应该加载 http://localhost:3333 但它说无法访问站点，这是我的 webpack 配置：

module.exports = 
    entry: './main.js',
    output: 
        path: '/',
        filename: 'index.js'
    ,
    devServer: 
        inline: true,
        port: 3333
    ,
    module: 
        loaders: [
            
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel',
                query: 
                    presets: ['es2015', 'react']
                
            
        ]
    

这是来自package.json 的我的脚本对象："start": "webpack-dev-server"。我已经在全球范围内安装了 webpack 和 webpack-dev-server。检查我得到的下图：

编辑：我的 package.json：

  "name": "react-app",
  "version": "1.0.0",
  "description": "sample",
  "scripts": 
    "start": "webpack-dev-server"
  ,
  "repository": 
    "type": "git",
    "url": "git+https://github.com/dheeraja00/react-app.git"
  ,
  "author": "Dheeraj Agrawal",
  "license": "ISC",
  "bugs": 
    "url": "https://github.com/dheeraja00/react-app/issues"
  ,
  "homepage": "https://github.comdheeraja00/react-app#readme",
  "dependencies": 
    "material-design-lite": "^1.2.1",
    "react": "^15.3.2"
  ,
  "devDependencies": 
    "babel-core": "^6.18.0",
    "babel-loader": "^6.2.5",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "css-loader": "^0.25.0",
    "file-loader": "^0.9.0",
    "node-sass": "^3.10.1",
    "raw-loader": "^0.5.1",
    "sass-loader": "^4.0.2",
    "style-loader": "^0.13.1",
    "webpack": "^1.13.2",
    "webpack-dev-server": "^1.16.2"
  

【问题讨论】：

请在运行该命令时在控制台中显示输出。

这是它在控制台中没有显示任何内容的问题，当我运行 npm start 时，它会在命令行中提供所有有效输出，说 (webpack)-dev-server/client?http://localhost:3333 3.97 kB 0 [built] 但是当我在浏览器中加载它时没有任何反应

nothing happens。您的意思是空白页、404 还是“无法访问此站点”？如果您使用 react-router，请检查您的路线。检查js文件是否加载。检查您的 chrome 开发工具的来源和控制台。

127.0.0.1:3333 或 0.0.0.0:3333 怎么样？

@KhangLu 查看我添加的截图

【参考方案1】：

您可以运行以下任一命令来为您的 reactJs 应用程序启动节点服务器：

 npm run-script start
 npm run start
 npm start

【参考方案2】：

npm start 仅在您有启动脚本时才有效。

对于以下示例，需要 webpack-dev-server 和 webpack 包。要添加这些软件包，您应该全局安装 webpack-dev-server 和 webpack。

npm install webpack-dev-server webpack -g

例如：

"scripts": 
    "start": "webpack-dev-server"
 

在你 package.json 中，基本上当你运行 npm start 时，它会搜索你的 package.json 以了解要做什么。

【讨论】：

它给了我这个错误：Cannot find module '/Users/dheeraj/Project/reactWeb/webpack-dev-server'

从路径中删除./。

@DheerajAgrawal 你在全球安装了 webpack-dev-server 和 webpack 吗？我试过了，在全局安装时效果很好。

修改了我的答案，这对我有用，将其添加到 package.json

@AJS 是的，我已经在全球范围内安装了它并尝试了你的新编辑，我的 package.json 上也有脚本，检查一下我在我的问题中添加了 package.json

【参考方案3】：

而不是尝试 URL：http://localhost:3333 试试网址：http://127.0.0.1:3333

而且，如果 http://127.0.0.1:3333 工作正常。 然后为了永久修复尝试向 /etc/hosts 文件添加一个条目，就好像它不存在或没有评论一样

127.0.0.1 localhost

【参考方案4】：

在我新安装的 Ubuntu 18.04 时遇到这种情况，我的主机文件中不存在 localhost，因此必须添加。

您可以通过将浏览器导航到127.0.0.1:3333 来检查这是否是您的问题。 如果可用，您需要将以下行添加到您的 /etc/hosts 文件中

127.0.0.1 localhost

【参考方案5】：

你需要一个全局版本的 webpack，然后再次运行脚本。

    use: https://127.0.01:3333

如果这仍然不起作用，请更改端口或停止在此端口上运行的服务