在WebStorm中使用Angular 4启用Bootstrap Intellisense

时间:2017-05-26 15:26:21

标签: twitter-bootstrap angular webstorm

我正在学习Angular 4,而且我正在使用Bootstrap CSS。

我已经使用npm安装了Bootstrap库,并且使用style.css文件夹下的src文件在我的Angular项目中导入了Bootstrap。

一切都运作良好,但WebStorm并没有建议我在编码时使用任何Bootstrap类,我无法理解为什么。我需要设置一些东西吗?

如果我在我的index.html文件中链接Bootstrap,一切正常。

3 个答案:

答案 0 :(得分:1)

嗨,我知道这有点晚了,但我最近有同样的问题,不得不关注我的一个旧项目。这是因为webstorm查看你的package.json for devDependencis解决这个问题的方法,无需移动任何文件就可以安装bootstrap来做npm install bootstrap@4.0.0-alpha --save-dev,这会自动将它添加到package.json或手动编辑它看起来像这样"devDependencies": { "@angular/cli": "1.0.1", "@angular/compiler-cli": "^4.0.0", "@types/jasmine": "2.5.38", "@types/node": "~6.0.60", "bootstrap": "^4.0.0-alpha.6"

我已经确认这已经解决了我的问题

答案 1 :(得分:0)

所以这就是问题所在。如果您使用 CDN 引用它,则无法自动完成Bootstrap:

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

因此,您必须在本地下载Bootstrap文件,并在开发期间引用它以使其填充自动完成功能。

所以你要将它下载并放入项目中,然后像本地那样引用它:

<link rel="stylesheet" href="./css/css/bootstrap-theme.min.css" >

完成开发后,将其切换回CDN链接。不幸的是,这是让它自动完成的唯一方法。 :/

答案 2 :(得分:0)

这看起来有点奇怪,但是我可以通过将整个引导程序文件夹(zip)复制到我的index.html所在的同一目录中来实现。我也对font-awesome文件夹做了同样的事。< / p>

找工作找我!如果有效,请告诉我。

我刚刚展示了一种新方法。在webstorm中右键单击文件夹并选择“标记为资源根”。这也对我有用。