Angular 2 npm start 报错
首先, index.html 和styles.css是和app目录平级的, 不要扔到里面去, 否则会404
确认配置文件齐全, 路径都正确之后 npm start

What?! 照着快速起步也会弄错吗? 人品问题吗?
很多人可能会看到npm报错:
$ npm start > angular-quickstart@1.0. start F:\work\angular_quickstart\angular
> tsc && concurrently "tsc -w" "lite-server" [] Did not detect a `bs-config.json` or `bs-config.js` override file. Using lite-server defaults...
[] ** browser-sync config **
[] { injectChanges: false,
[] files: [ './**/*.{html,htm,css,js}' ],
[] watchOptions: { ignored: 'node_modules' },
[] server: { baseDir: './', middleware: [ [Function], [Function] ] } }
[] :: - Compilation complete. Watching for file changes.
[] [BS] Access URLs:
[] --------------------------------------
[] Local: http://localhost:3000
[] External: http://192.168.155.1:3000
[] --------------------------------------
[] UI: http://localhost:3001
[] UI External: http://192.168.155.1:3001
[] --------------------------------------
[] [BS] Serving files from: ./
[] [BS] Watching files...
[] 16.11. :: GET /index.html
[] 16.11. :: GET /favicon.ico
除了404是上面说的文件摆放路径错误意外, 其实不需要care它的, 和正常启动应用无关, 属于npm版本相关问题, 此处不赘述。
重要的是console里面的log:

The module AppModule was bootstrapped, but it does not declare "@NgModule.bootstrap" components nor a "ngDoBootstrap" method. Please define one of these.
这句还是make sense的, 意思是

初始化的时候用的platform.bootstrapModule(), 却没有把bootstrap引用为[ AppComponent ]
问题就出在这里 

这里是应用的入口点。
由于 QuickStart 是运行在浏览器中的 Web 应用,所以根模块需要从
@angular/platform-browser中导入BrowserModule并添加到imports数组中。这是要让最小的应用在浏览器中运行时,对 Angular 的最低需求。
QuickStart 应用不做别的,也就先不需要其它模块。在真实的应用中,我们可能还得导入
FormsModule、RouterModule和HttpModule。这些会在 英雄指南教程中引入。
官方文档上给的最低需求,低到连它自己给出的index.html都显示不出来了...
我老眼昏花只用了最低配置, 而没有看到就在下面几行它其实又贴了一次这个文件:

这才是
要用的!

You see, 改完这个文件以后应该就不会报错了, 最后的console应该变成这样:

Angular 2 npm start 报错的更多相关文章
- 执行npm install报错:npm ERR! code EINTEGRITY
命令行执行npm install报错如下: D:\frontend\viewsdev>npm install npm ERR! code EINTEGRITY npm ERR! sha512-8 ...
- npm install 报错:node-pre-gyp ERR! 问题解决
npm install报错问题解决 问题: E:\CodeSpace\GitlabTest\desktop>npm install > lifeccp-desktop@1.1.9 post ...
- vuejs npm chromedriver 报错
vuejs npm chromedriver 报错 # 全局安装 vue-cli$ npm install -g vue-cli# 创建一个基于 "webpack" 模板的新项 ...
- npm install 报错 error Unexpected end of JSON input while parsing near '...sShrinkwrap":false,"d' 解决办法
npm install 报错 : error Unexpected end of JSON input while parsing near '...sShrinkwrap":false,& ...
- 执行命令npm publish报错:403 Forbidden - PUT https://registry.npmjs.org/kunmomotest2 - You cannot publish over the previously published versions: 0.0.1.
前言 执行命令npm publish报错:403 Forbidden - PUT https://registry.npmjs.org/kunmomotest2 - You cannot publis ...
- 执行npm publish 报错:403 Forbidden - PUT https://registry.npmjs.org/kunmomotest - you must verify your email before publishing a new package: https://www.npmjs.com/email-edit
前言 执行npm publish 报错:403 Forbidden - PUT https://registry.npmjs.org/kunmomotest - you must verify you ...
- 执行npm publish 报错:401 Unauthorized - PUT https://registry.npmjs.org/kunmomotest - You must be logged in to publish packages.
前言 执行npm publish 报错:401 Unauthorized - PUT https://registry.npmjs.org/kunmomotest - You must be logg ...
- npm启动报错
npm 启动报错 event.js 160 报错原因: 端口号被占用 解决方法: 1.重新定义一个端口号. 2.任务管理器关掉node进程,重新运行npm.
- npm -v 报错:Error: EPERM: operation not permitted, mkdir 'C:\soft\nodejs'
npm -v 报错:Error: EPERM: operation not permitted, mkdir 'C:\soft\nodejs' 起因:原本安装node在C盘soft文件夹下,按node ...
随机推荐
- InstallShield12豪华版破解版下载|InstallShield下载|软件打包工具
InstallShield 12 豪华版+破解版 下载 下载速度:220kb/s InstallShield 12为软件发行方提供率先的安装程序解决方式,可以制作强大可靠的Windows Instal ...
- Cocos2d-X中字符串的处理
CCString 用惯了NSString,你会严重高估自己处理字符串的能力.使用Cocos2d-X后只能用char*或者string来代替.诸如字符串的拼接,替换,查找都比NSString麻烦不少. ...
- PureMVC(JS版)源码解析(五):SimpleCommand类
之前我们对PureMVC中涉及到观察者模式的三个基本类(Notification/Observer/Notifier)进行了分析,接下来将对PureMVC源码中的其他类进行分析,首先我们讲 ...
- Linux如何卸载挂载文件
在我们进行远程文件操作的时候,我们经常会出现文件服务出现卸载掉哦情况.例如 umount /mnt/net1umount: /mnt/net1: device is busy. (In ...
- PHP表单验证内容是否为空
内容为空效果图为: 填写内容效果图: 下面是验证程序的代码: <!doctype html> <html> <head> <meta http-equiv=& ...
- python中文件类的应用
python中对文件.文件夹的操作需要涉及到os模块和shutil模块. 创建文件: 1) os.mknod("test.txt") 创建空文件 2) open("tes ...
- SQL内外左右交叉连接
什么是连接查询? 概念:根据两个表或多个表的列之间的关系,从这些表中查询数据. 目的:实现多个表查询操作. 一般是用作关联两张或两张以上的数据表时用的.看起来有点抽象,我们举个例子,做两张表:学生表( ...
- 从零开始 WIN8.1 下Android 开发环境搭建
一.JDK安装 当前最新版本是JDK8.0 地址http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-21331 ...
- Quartz定时任务使用小记(11月22日)
骤然接触quartz,先从小处着手,why,what,how quartz定时任务: 为什么使用quartz定时任务,以及定时任务在实际应用场景下的特定需求. 1.用户方面的需要,为了提供更好的使用体 ...
- 读书笔记之 - javascript 设计模式 - 代理模式
代理(proxy)是一个对象,它可以用来控制对另一对象的访问.它与另外那个对象实现了同样的接口,并且会把任何方法调用传递给那个对象.另外那个对象通常称为本体.代理可以代替本体被实例化,并使其可被远程访 ...