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 ...
随机推荐
- Android之PreferenceActivity 详解
看到很多书中都没有对PreferenceActivity做介绍,而我正好又在项目中用到,所以就把自己的使用的在这总结一下,也方便日后查找. PerferenceActivity是什么,看下面的截图: ...
- Publisher/Subscriber(发布/订阅者)消息模式开发流程
该模式的作用是发布者和订阅者 可以相互发送消息 发布者和订阅者都充当 生产者和消费者 发布者 package publisher.to.subscriber; import java.awt.font ...
- hdu2041java
超级楼梯 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submis ...
- iOS监听电话事件
项目上有个需求,要求打完电话后加积分. 首先导入这两个头文件: #import <CoreTelephony/CTCallCenter.h> #import <CoreTelepho ...
- wsdl自动生成Java代码,根据wsdl生成Java代码
wsdl自动生成Java代码,根据wsdl生成Java代码 >>>>>>>>>>>>>>>>>&g ...
- ASP.NET MVC 第八回 Helper之演化
题目:如何在View中写一个超级连接连接到主页? 这个问题看起来很好回答: <a href="/home/index">首页</a> 其实上面这种不能称之为 ...
- SharePoint SiteCollection Administrator
到网上去找怎么取到一个站点的sitecollection Administrator, 如果设置了一个站点的 sitecollection Administrator, 那么通过: SPSite ...
- Javascript 汉字转拼音
调用方式: var pinyin = convert("欢迎光临"); alert(pinyin); 新建JS文件:PYConvert.js,内容如下: var PinYin = ...
- WPF中窗口控件的跨线程调用
在WinForm中,我们要跨线程访问窗口控件,只需要设置属性CheckForIllegalCrossThreadCalls = false;即可. 在WPF中要麻烦一下,同样的不允许跨线程访问,因为没 ...
- python基础知识五
数据结构基本上就是---它们可以处理一些数据的结构.或者说,它们是用来存储一组相关数据的. python中有三种内建的数据结构---列表.元祖和字典. 我们将会学习如何使用它们,以及它们如何使编程变得 ...