angularJS开发遇见的问题 - yulilong/my_blog GitHub Wiki
[TOC]
- 问题分析：
npm install包没有安装完全， - 解决方法
- 删除项目目录下面的
node_modules文件夹，运行命令：npm install，npm start，多试几次。 - 更换npm安装源：
# 安装npm 镜像源管理包
~ npm install nrm -g
# 下面命令会列出npm镜像源
~ nrm ls
# 选择淘宝的镜像源
~ nrm use taobao
然后从复方法一的步骤，尝试10次后就不要再尝试了，说明这个方法不管用。
3. 从同事那里把已经成功的 node_modules 文件夹 复制过来，放到工程目录下面，然后运行命令：
# 如果操作系统不同，就需要运行下面的命令来从新绑定系统
~ npm rebuild node-sass
# 启动命令
~ npm start
解决方法：
https://stackoverflow.com/questions/39103483/uncaught-referenceerror-webpack-external-module-xx-is-not-defined/39105605#39105605
The solution was to set libraryTarget: 'amd' in the webpack.config.js file like so:
output: {
filename: 'dist/[name].bundle.js',
libraryTarget: 'amd'
},
https://segmentfault.com/a/1190000007560996
这个错误是由于awesome-typescript-loader package导致的，解决方法：
编辑文件~/node_modules/awesome-typescript-loader/dist/instance.js:
https://github.com/s-panferov/awesome-typescript-loader/issues/293
大约是142行，替换applyDefaults 函数体内容：
function applyDefaults(configFilePath, compilerConfig, loaderConfig) {
_.defaults(compilerConfig.options, {
sourceMap: true,
verbose: false,
skipDefaultLibCheck: true,
suppressOutputPathCheck: true
});
if (loaderConfig.transpileOnly) {
compilerConfig.options.isolatedModules = true;
}
_.defaults(compilerConfig.options, {
sourceRoot: compilerConfig.options.sourceMap ? process.cwd() : undefined
});
_.defaults(loaderConfig, {
sourceMap: true,
verbose: false,
});
delete compilerConfig.options.outDir;
delete compilerConfig.options.inlineSourceMap;
delete compilerConfig.options.outFile;
delete compilerConfig.options.out;
delete compilerConfig.options.noEmit;
}
保存后，从新运行命令 npm start即可解决问题。
根据链接：https://github.com/sass/node-sass/releases/tag/v3.13.1
可知道是node版本太高了，卸载node后，下载低版本的node即可解决问题。
根据错误提示,终端运行npm rebuild node-sass即可解决这个问题。
这个错误由于使用了服务， 但是这个服务没有引入到模块中，找到服务，并把服务引入到模块中就好。
运行npm start时报错，错误信息：
@types\fullcalendar\index.d.ts
cannot find type definition file for 'jquery',
Module ''*'' has no exported member 'Duration'
Module ''*'' has no exported member 'Moment'
解决方案： 在tsconfig.json 文件中 添加下面语句：
"typeRoots": [
"node_modules/@types"
],
- 错误原因
在添加新模块的时候，模块类名 前面没有加default关键字，如：
export class UserDetailModule { }
- 解决方法
在模块类名前面加上关键字default：
export default class UserDetailModule { }
- 错误原因：
使用split方法的元素是个undefined;
- 解决方法
在使用split方法前，先判断元素是否为空。
错误代码Html文件
<div>
<span>{{value.text}}</span>
</div>
ts文件
public value: any;
正确写法：
<div>
<span>{{value?.text}}</span>
</div>
或者
<div *ngIf="value">
<span>{{value.text}}</span>
</div>
？.是angular提供的安全导航操作符，用来保护出现在属性路径中的null和undefined值
如在浏览器中输入http://localhost:3000/#/big-Data， Google浏览器会先把big-data,然后去匹配路径，
导致angular路由 无法匹配转到了默认路径上，
所以最好不要有大写字母存在。
触发原因：页面的返回头被设置 X-Frame-Options SAMEORIGIN ，只能被同源的iframe 引用。跨域名的iframe 没法显示了。
这个在angular中， 本地开发中webpack中配置代理， 服务器中 Nginx中配置代理即可解决问题。
使用速度命令安装：sudo cnpm i
使用npm命令安装这个缺少的包：sudo cnpm i color-convert