Angular-cli: BrowserslistError: navegador desconocido mayor en el error

Creado en 28 dic. 2017  ·  94Comentarios  ·  Fuente: angular/angular-cli

Acabo de eliminar la carpeta node_modules y devolví los paquetes

Mac OS
Nodo 8
nodo: 8
"@ angular / común": "^ 5.0.0",
"@ angular / compiler": "^ 5.0.0",
"@ angular / compiler-cli": "^ 5.0.0",
"@ angular / core": "^ 5.0.0",
"@ angular / forms": "^ 5.0.0",
"@ angular / http": "^ 5.0.0",
"@ angular / cli": "^ 1.5.0",
"@ angular / compiler-cli": "^ 5.0.0",

Error:
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/bootstrap/dist/css/bootstrap.min.css Module build failed: BrowserslistError: Unknown browser major at error (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:37:11) at Function.browserslist.checkName (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:320:18) at Function.select (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:438:37) at /Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:207:41 at Array.forEach (native) at browserslist (/Users/aleksandrgusev/Documents/express_client/node_modules/browserslist/index.js:196:13) at Browsers.parse (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/browsers.js:44:14) at new Browsers (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/browsers.js:39:28) at loadPrefixes (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/autoprefixer.js:56:18) at plugin (/Users/aleksandrgusev/Documents/express_client/node_modules/autoprefixer/lib/autoprefixer.js:62:18) at LazyResult.run (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:270:20) at LazyResult.asyncTick (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:185:32) at LazyResult.asyncTick (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:197:22) at LazyResult.asyncTick (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:197:22) at processing.Promise.then._this2.processed (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:224:20) at LazyResult.async (/Users/aleksandrgusev/Documents/express_client/node_modules/postcss-loader/node_modules/postcss/lib/lazy-result.js:221:27) @ ./node_modules/bootstrap/dist/css/bootstrap.min.css 4:14-131 @ multi ./src/styles.scss ./src/select.css ./node_modules/bootstrap/dist/css/bootstrap.min.css ./node_modules/font-awesome/css/font-awesome.min.css ./node_modules/primeng/resources/primeng.min.css ./node_modules/primeng/resources/themes/omega/theme.css ./node_modules/material-design-icons/iconfont/material-icons.css

1 (urgent) bufix

Comentario más útil

¿Intentaste esto? Mismo error y corregido por,

  • De "bootstrap": "^ 4.0.0-beta.2" a "bootstrap": "4.0.0-beta.2", saque "^"
  • Entonces npm install
  • Entonces ng servir

Todos 94 comentarios

Me encuentro con el mismo problema aquí.

Dónde ?

La versión beta 3 de bootstrap 4.0.0 salió hoy. Es posible que tenga que volver a bajar a su versión beta 2 para que funcione. Me encuentro con el mismo problema.

@ bryan-pegg23 Gracias. Bootstrap fue un problema en mi caso.

El problema parece deberse a esta sección del archivo package.json de bootstrap

 "browserslist": [
    "last 1 major version",
    ">= 1%",
    "Chrome >= 45",
    "Firefox >= 38",
    "Edge >= 12",
    "Explorer >= 10",
    "iOS >= 9",
    "Safari >= 9",
    "Android >= 4.4",
    "Opera >= 30"
  ],

El complemento autoprefixer usa esta lista y, a menos que tenga una versión 7.0 o superior, no es compatible con la sintaxis last n major version .

La actualización de autoprefixer debería solucionar el problema.

ERROR en ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader?{"ident":"postcss"}!./node_modules/bootstrap/dist/ css / bootstrap.min.css
Error de compilación del módulo: BrowserslistError: Explorador principal desconocido

El mismo error, acaba de empezar a suceder.

Autoprefixer está en 6.7.7
Boostrap 4.0.0 beta.2

package.json

{
  "name": "apm",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve -o --port 3913",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint --type-check",
    "e2e": "ng e2e",
    "build-prod": "ng build --prod --aot"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^5.0.0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.8",
    "angular-dual-listbox": "^4.4.0",
    "bootstrap": "^4.0.0-beta.2",
    "core-js": "^2.4.1",
    "font-awesome": "^4.7.0",
    "jquery": "^1.9.1",
    "ng2-select": "^2.0.0",
    "ngx-progressbar": "^2.1.1",
    "ngx-toastr": "^6.5.0",
    "popper.js": "^1.12.3",
    "rxjs": "^5.4.1",
    "underscore": "^1.8.3",
    "zone.js": "^0.8.14"
  },
  "devDependencies": {
    "@angular/cli": "1.5.0",
    "@angular/compiler-cli": "^5.0.0",
    "@angular/language-service": "^5.0.0",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/jquery": "^3.2.15",
    "@types/node": "~6.0.60",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.0.4",
    "tslint": "~5.3.2",
    "typescript": "~2.4.2"
  }
}

package-lock.json

"autoprefixer": {
      "version": "6.7.7",
      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
      "dev": true
    },

json
"bootstrap": {
"versión": "4.0.0-beta.2",
"resuelto": " https://registry.npmjs.org/bootstrap/-/bootstrap-4.0.0-beta.2.tgz ",
"integridad": "sha512-DzGtdTlKbrMoGMpz0LigKSqJ + MgtFKxA791PU / q062OlRG0HybNZcTLH7rpDAmLS66Y3esN9yzKHLLbqa5UR3w =="
},

```json
 "postcss-loader": {
      "version": "1.3.3",
      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
      "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
      "dev": true
    },

@ekwebster "bootstrap": "^4.0.0-beta.2" el símbolo de intercalación aquí significa que lo actualizará a la versión más reciente, solo intente yarn upgrade [email protected] o npm update [email protected]

@ekwebster Parece que la sintaxis last n major versions se agregó en browserList 2.4 y el autoprefixer se actualizó a la versión 2 de browserList en la versión 7.0 .

Por lo tanto, cualquier versión de autoprefixer superior a 7.0 debería funcionar. Corregí mi comentario anterior.

Yo tengo el mismo error

Me encontré con este problema al intentar usar el último angular-cli "1.6.3" con el último arranque "4.0.0-beta.2".

¿Intentaste esto? Mismo error y corregido por,

  • De "bootstrap": "^ 4.0.0-beta.2" a "bootstrap": "4.0.0-beta.2", saque "^"
  • Entonces npm install
  • Entonces ng servir

Quitar el signo de intercalación '^' resolvió el problema

Tengo el mismo problema, en cambio, recibo una advertencia.

ADVERTENCIA en ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}! ./node_modules/sass-loader/lib/loader.js?{"sourceMap":fal
se, "precisión": 8, "includePaths": []}! ./ src / style-sheets / theme / theme.scss
(Valor emitido en lugar de una instancia de Error) postcss-custom-properties: C: Userskrishna.chandraDesktopretailng-uisrcstyle-sheetsthemetheme. scss: 456 : 5: la variable '--globalSub2' no está definida y u
sed sin un retroceso
NonErrorEmittedError: (Valor emitido en lugar de una instancia de Error) postcss-custom-properties: C: Userskrishna.chandraDesktopretailng-uisrcstyle-sheetsthemetheme. scss: 456 : 5: variable '--globalSu
b2 'no está definido y se usa sin un respaldo
en Object.emitWarning (C: Userskrishna.chandraDesktopretailng-uinode_moduleswebpacklibNormalModule.js: 117: 16)
en result.warnings.forEach (C: Userskrishna.chandraDesktopretailng-uinode_modulespostcss-loaderlibindex.js: 149: 49)
en Array.forEach (nativo)
en postcss.process.then (C: Userskrishna.chandraDesktopretailng-uinode_modulespostcss-loaderlibindex.js: 149: 27)
@ ./src/style-sheets/theme/theme.scss 4: 14-208
@ multi ./node_modules/bootstrap/dist/css/bootstrap.min.css ./node_modules/primeng/resources/themes/omega/theme.css ./node_modules/primeng/resources/primeng.min.css ./src/style -hojas / theme / theme.scss ./
node_modules / font-awesome / css / font-awesome.css
"4.0.0-beta.2" no funcionó en mi escenario.

Esto parece estar relacionado con [email protected] , y también está causando fallas en nuestro CI (https://travis-ci.org/angular/angular-cli/jobs/322676874).

Estaba enfrentando el mismo problema.
Bajé bootstrap con los siguientes pasos.
Desinstale [email protected] :
_npm desinstalar bootstrap --save_
Luego instaló [email protected] :
_npm install [email protected] --save_

No eliminé ^ porque package-lock.json lo manejará.

mismo problema aquí - en dos computadoras portátiles diferentes. ¿Por qué beta.3 todavía está disponible en su sitio?

He arreglado mi package.json para:

"bootstrap": "4.0.0-beta.2"
Si tiene una aplicación en un entorno de producción, creo que la mejor práctica es utilizar una versión estable y fija.

Pasos:

1-Eliminar / node_modules
2-Repara el archivo package.json
3-Ejecutar la instalación de npm
4-¡Disfruta!

Bajé bootstrap a " [email protected] " y la aplicación volvió a funcionar.

También estoy enfrentando el mismo problema
ERROR en ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/bootstrap/dist/ css / bootstrap.min.css

@ ./~/bootstrap/dist/css/bootstrap.min.css 4: 14-127
@ multi ./~/bootstrap/dist/css/bootstrap.min.css
webpack: no se pudo compilar.

sigue sucediendo - también hoy tuve que especificar beta 2 ya que 3 producirá el mismo error que el anterior

Una solución aquí en SO (https://stackoverflow.com/questions/48034051/bootstrap-4-beta-3-throws-error-with-angular-cli). Deberá volver a ejecutarse cada vez que actualice, hasta la próxima versión de CLI que actualice el prefijo automático a la última ...

Esto debería arreglarse en el lado de las CLI de Angular en la próxima versión ( 1.6.4 ). Eso debería ser la semana que viene.

Gracias, por el momento copio manualmente los archivos de bootstrap beta 3 para beta 2 en mi proyecto "proynode_modulesbootstrapdistcss" y podría renderizar normalmente porque necesito usar algunos estilos que beta 2 no tiene.

Cambié la ruta a bootstrap.scss @import "~ bootstrap / scss / bootstrap.scss"; en el archivo styles.scss. Y resolvió este problema
También agregando paquetes node-sass y sass-loader

Yo también tengo el mismo problema.

El mismo problema aquí y la solución de @ Domer79 no funciona, la CLI angular muestra el mismo error

Puede usar Bootstrap 4 beta 3, pero primero edite package.json en node_modules / bootstrap:

"lista de navegadores": [
"última 1 versión principal", <----- eliminar esta línea
"> = 1%", <----- eliminar esta línea
"Chrome> = 45",
"Firefox> = 38",
"Borde> = 12",
"Explorador> = 10",
"iOS> = 9",
"Safari> = 9",
"Android> = 4.4",
"Opera> = 30"
],

@jameskentTX me proporcionó la solución. Excepto que el nombre del archivo es package.json en la carpeta node_modules / bootstrap para mí.

¡Hola!
Actualicé para lanzar 1.6.4 , pero siempre me enfrento al problema, usando [email protected] .
Desafortunadamente, necesito usar esa versión de bootstrap porque soluciona otro problema.
Probaré la solución alternativa propuesta hace unos días, pero espero que sea una solución "más limpia".
Gracias por el apoyo.

CLI 1.6.4 no soluciona el problema.

CLI 1.6.4 solucionó el problema por mí.

El error persiste solo en las compilaciones de producción.

Arreglo de temperatura

  • cambiar el archivo style.css a style.scss
  • cambiar la referencia style.css en .angular-cli.json a style.scss
  • en style.scss import
    @importar '~ bootstrap / scss / bootstrap.scss';

Deberia trabajar

¡CLI 1.6.4 no soluciona el problema!
Pero después de aplicar una solución alternativa por @jameskentTX, está funcionando. Como queríamos la versión beta 3 de bootstrap en nuestro proyecto, tenemos que usar esta solución alternativa hasta que Angular CLI solucione el problema.

Debes combinar la solución @megafy y @jameskentTX

¿Puedes probar @angular/[email protected] lugar, por favor? Consulte https://github.com/angular/angular-cli/issues/9029#issuecomment -357267439 para obtener más detalles.

@filipesilva Sí, usando @angular/[email protected] soluciona el problema.

Incluso yo me enfrento al mismo problema.

package.json
{
...
...

"ngx-bootstrap": "^ 1.9.3",
...
...
}

package-lock.json
{
...
"autoprefixer": "6.7.7",
...
}

no puedo resolverlo. Alguna ayuda

Tengo @angular/[email protected] pero este problema no ha desaparecido. Noté que surgen problemas dentro de src/styles.css y con <strong i="7">@import</strong> '~any/lib/here.css'; . Es decir, no depende de la biblioteca, si se importa de esta forma. Lo principal es que al principio había una tilda.

/* This not works */
<strong i="10">@import</strong> '~highlight.js/styles/default.css';
<strong i="11">@import</strong> '~highlight.js/styles/googlecode.css';
<strong i="12">@import</strong> '~font-awesome/css/font-awesome.min.css';
<strong i="13">@import</strong> '~katex/dist/katex.min.css';

/* This works */
<strong i="14">@import</strong> 'assets/css/angular.css';
<strong i="15">@import</strong> 'assets/css/blog.css';

Golpee los mismos problemas definidos anteriormente usando cli 1.6.5 mientras intenta realizar una compilación de producción.

La corrección temporal sugerida por @jameskentTX anteriormente permitió que se ejecutara la compilación de producción.

Actualicé a @angular/[email protected] , creé un nuevo proyecto, agregué bootstrap@^4.0.0 y pude iniciar la aplicación con bootstrap.min.css enchufado agregándolo como @import a mi styles.css . También pude iniciar mi aplicación conectándola a través de .angular-cli.json agregándola a los estilos.

Un problema aquí sería asegurarse de actualizar su global y su aplicación a @ angular / cli a 1.7.0-beta.1 y verificar que realmente se actualizó ejecutando ng --version (el mío no lo hizo, así que tuve que hacerlo) quítelo manualmente y vuelva a instalarlo por alguna razón).

Yo tuve el mismo problema. esto se debe a que 4.0.0-beta.3. Por favor, baje a 4.0.0-beta.2
Pasos detallados:
En tu pakage.json
"bootstrap": "^ 4.0.0-beta.2" reemplácelo con "bootstrap": "4.0.0-beta.2" (elimine el signo de la zanahoria)
desinstalación de npm
npm install
Esto debe arreglarlo.

Simplemente actualice de 4.0.0-beta a 4.0.0 y experimentó este problema con ng serve. Volvió a 4.0.0-beta y ng serve está bien. Este problema no debería cerrarse si se trata de un problema de cli.

Simplemente actualizar a @ angular / [email protected] resolvió el problema para mí, como propuso @ Jimeh87 .

@dduft Pero si no nos informaran que ng cli 1.6.4+ solucionaría este problema, y ​​en 1.6.4, recuerdo que se solucionó.

Ahora en 1.6.5 y el problema asoma su fea cabeza. ¿Está retrocediendo la CLI?

@pranaysand La idea de bajar de categoría no suena bien en mis oídos. En 1.6.3, no podía funcionar con bootstrap 4.0.0-beta.3, por lo que tuvo que ser degradado para que funcione.

Ahora, en 1.6.5, para que funcione, ¿tenemos que degradar a una versión beta de bootstrap?

Se corrigieron las compilaciones de desarrollo. Las compilaciones de producción requerían cambios adicionales que ya estaban presentes pero que solo están disponibles en 1.7 (actualmente en beta). La canalización de optimización de la hoja de estilo se reescribió proporcionando un mayor rendimiento y solucionando múltiples problemas subyacentes. Sin embargo, esto no se puede publicar en una versión de parche, por lo tanto, su presencia en 1.7 y no 1.6.x.

cli 1.7.0-beta.1 corrige el problema cuando se usa también la última versión de bootstrap (4.0.0) (no beta).

Simplemente actualice globalmente su angular / cli antes de comenzar un nuevo proyecto:
npm i -g @ angular / cli
¡También funciona con beta 3!

¡Hola a todos!
Leí todos tus comentarios y después de seguir la mayoría de los registros que el npm deja en mi consola (después de una pelea aburrida con bootstrap), desinstalo y reinstalo:
npm desinstalar bootstrap --save subsecuentemente npm install [email protected] --save, así que veo en la consola: esta advertencia:

npm WARN [email protected] requiere un par de [email protected] - 3 pero no hay ninguno instalado. Debes instalar peer depe
ndencies usted mismo.
npm WARN [email protected] requiere un par de popper.js@^1.12.3 pero ninguno está instalado. Debes instalar peer dep
endencies usted mismo.

Sigo la sugerencia, entonces npm install [email protected] --save y npm install popper.js@^1.12.3 --save
finalmente: npm install y ng serve y FUNCIONA !!!

Es trabajo, gracias

Bootstrap actualizado a 4.0.0 "estable" hoy con la esperanza de que esto se solucione => no es
Seguí el consejo de @jameskentTX y borré las líneas sospechosas del package.json de bootstrap. Ahora funciona.

Sin embargo, esto es muy hacky.

Estoy usando bootstrap 4.0.0 con CLI v 1.6.5 . Sigo recibiendo este error

El uso de Angular CLI 1.7.0 beta 2 funcionó para mí hoy. ¡Gracias a todos los que lo mencionaron! 💯

Cualquiera que use las versiones beta de cli 1.7.0 puede tener problemas con 404s / páginas en blanco al volver a cargar la página, por ejemplo, cuando usa ng serve, ya que hay un error de cli. He solucionado este problema:
https://github.com/angular/angular-cli/issues/9297

Probé [email protected] con Angular CLI 1.6.6 (local y global), y funcionó bien.

Usé [email protected] y @ angular / [email protected] y todavía no funciona

Paso 1.
Dentro de .angular-cli.json

"styles": [
        "styles.css",
        "../node_modules/bootstrap/dist/css/bootstrap.min.css" 
 ]

Quitar "../node_modules/bootstrap/dist/css/bootstrap.min.css"

Paso 2.
Ir a styles.css

Importar bootstrap agregando esta línea
<strong i="19">@import</strong> "~bootstrap/dist/css/bootstrap.css";

Estos pasos resolvieron los errores que obtuve durante el proceso de construcción.

Tiene el mismo problema.

ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/bootstrap/dist/css/bootstrap.min.css
Module build failed: BrowserslistError: Unknown browser major
    at error (E:\notWork\angular4Course\directives-deep\node_modules\browserslist\index.js:37:11)
...

Acabo de comenzar a aprender Angular, no necesito bootstrap 4. Solo quiero la solución más simple para hacer que mi proyecto vuelva a estar vivo. Así que rebajé un bootstrap.

  1. En package.json archivo cambié a "bootstrap": "3.3.7",
  2. luego ejecuta npm install
  3. después de eso ng serve --open

Estoy usando bootstrap 4.0.0 con CLI v 1.6.3 .

<strong i="8">@import</strong> "~bootstrap/scss/bootstrap";

Esto funcionó para mí.

El error "BrowserslistError: Unknown browser major scss" todavía está ocurriendo en el último bootstrap 4.0.0 y CLI 1.6.6, para resolver el problema tuve que degradar el bootstrap a 4.0.0-beta.2 sin el símbolo de intercalación con el símbolo de intercalación. el mismo error también.

@alanreji probé tu solución y funcionó perfectamente ... thnx

  1. cambie el style.css a scss (y todo el css a scss también).
  2. @import "../node_modules/bootstrap/scss/bootstrap.scss"; -> poner esto en la primera línea de style.scss
  3. elimine bootstrap.css o bootstrap.min.css en angular-cli.json
    ng build --prod
    todo funciona en consecuencia.
    Gracias chicos.....

gracias a todos por su ayuda, el problema esta resuelto!

@mokth ¿Está diciendo que tuvo que convertir TODOS los archivos css utilizados en el proyecto a scss o solo los archivos de arranque que está utilizando / importando?

¡La instalación de angular cli 1.6.6 me resuelve el problema!

1.6.6 no resuelve el problema.

@SteveIngels Acabo de probar la solución que @mokth proporcionó.

Deberá eliminar "../node_modules/bootstrap/dist/css/bootstrap.min.css" de .angular-cli.json .
Luego cambie "styles.css" a "styles.scss" en .angular-cli.json .
Luego cambie el archivo real style.css a style.scss y agregue <strong i="17">@import</strong> "../node_modules/bootstrap/scss/bootstrap.scss" en la parte superior del archivo.

@ joseph-schenck esta solución funcionó y se siente como la solución correcta.

angular-cli 1.4.10 (tiene que ejecutar Angular 4 bc de LTS)
bootstrap 4.0.0

@jglisson esta solución usa scss en lugar del css compilado de bootstrap simple, y omite la forma angular-cli de inclusión de estilos importándolo directamente al archivo principal styles.css .

Ciertamente, no parece ser una solución adecuada.

@Miced gracias por tu respuesta.

Parecía apropiado porque no altera la lista de navegadores package.json para bootstrap. Utiliza la implementación sass en lugar de la implementación css, lo que me parece bien.

¿Que sugieres?

La próxima versión beta, @angular/[email protected] , se construyó con éxito en modo de producción sin cambiar ninguno de mis archivos, como sugirió @filipesilva. Ya lo estoy usando sin ningún otro problema.

Estamos obligados a utilizar Angular 4 debido a LTS.

1.7 seguirá soportando la construcción de Angular 4; al igual que 1.5 y 1.6. Si tiene problemas para hacerlo, abra un problema que describa el problema.

Gracias @clydin

Esto puede sonar tonto entonces (y fuera de tema, así que me disculpo). Pero, ¿cómo se usa ng new para crear un proyecto angular 4 con cli 1.5 / 6/7? He estado buscando en línea bastante y lo único que he encontrado es usar cli 1.4.10 (porque 1.4.9 tiene un problema).

El mismo problema que enfrenté hoy.

Descubrí que mi CLI no se actualizó. Actualicé mi CLI a nivel mundial y local y funcionó bien.
Así que siempre es bueno actualizar nuestra CLI Angular y luego intentar instalar paquetes.

Bootstrap v4.0.0 se lanzó el 18 de enero de 2018. Por lo tanto, ir a v4.0.0-alpha.x no puede ser la mejor solución: - /

Hice lo mismo que @ yaswanth89kumar . Configuré mi proyecto usando angular-cli 1.4.10 y luego actualicé el cli a la última versión.

Error de compilación del módulo: ModuleBuildError: Error de compilación del módulo: BrowserslistError: Mayor desconocido del navegador

"styles": [
        "../node_modules/bootstrap/scss/bootstrap.scss",
        "styles.scss"
      ]
+

"defaults": {
    "styleExt": "scss",
    "component": {}
  }

hot-fix ver en el último comentario @ joseph-schenck

@angular/cli: 1.7.0-rc.0 resolvió el problema

Si bien la actualización a @angular/cli: 1.7.0-rc.0 permitió que mi código se compilara con --prod , todos mis íconos de fuentes increíbles en mi aplicación fueron reemplazados por cuadrados

@ bomberblue07 Lo mismo para mí. 1.7.0-beta.1 embargo, parece resolver ambos problemas.

Pero definitivamente hay algunos problemas con las fuentes en las versiones 1.7.x más recientes.

Por ejemplo, en mi sección de estilos angular-cli.json podría tener "./assets/fonts/icon-fonts/icon-fonts.css" , y en ese archivo css podría tener:

@font-face {
    font-family: "My icon fonts";
    src:url('./icon-fonts.eot');
    src:url('./icon-fonts.eot?#iefix') format('embedded-opentype'),
        url('./icon-fonts.woff') format('woff'),
        url('./icon-fonts.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

y luego el navegador tiene advertencias sobre la corrupción de estos archivos woff / tff. Incluso los descargué y los comparé con el original, y de hecho son diferentes.

Creo que el error se introdujo en 1.7.0-beta2 o 3. @filipesilva

actualice a ng cli 1.6.8 en project y global. funciona con bootstrap 4.0

"bootstrap": "4.0.0-beta.2" es la salsa

Se cambió la versión de cli a 1.7.0 en package.json. Trabajando como se esperaba ahora.

@ joseph-schenck solución resolvió mi problema

La eliminación del signo de intercalación '^' de "bootstrap: ^ 4.0.0-beta.2" resolvió el problema.
Gracias por @oopsmails

He eliminado las siguientes dos líneas del archivo bootstrap / package.json

"última 1 versión principal",
"> = 1%",

@oopsmails
Gracias

"bootstrap": "4.0.0-beta.2" funcionó para mí.

la actualización de bootstrap a 4.1.3 funcionó para mí. Me enfrentaba a este problema con la versión 4.1.1 de bootstrap

¡Decir ah! eso es extraño, "node_modules / bootstrap / dist / css / bootstrap.min.css", hizo el truco.

bootstrap ":" ^ 4.1.3 ",
CLI angular: 6.1.3

@wandersonsc Probablemente el seguimiento de la ruta cli haya cambiado, supongo 🤔

Estaba enfrentando el mismo problema con la versión de arranque 4.1.3 y cli v 6.1.4.
"node_modules / bootstrap / dist / css / bootstrap.min.css" realmente lo resolvió 😲

Este problema se ha bloqueado automáticamente debido a la inactividad.
Por favor, presente un nuevo problema si se encuentra con un problema similar o relacionado.

Obtenga más información sobre nuestra política de bloqueo automático de conversaciones .

_Esta acción ha sido realizada automáticamente por un bot._

¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

sysmat picture sysmat  ·  3Comentarios

rwillmer picture rwillmer  ·  3Comentarios

naveedahmed1 picture naveedahmed1  ·  3Comentarios

jmurphzyo picture jmurphzyo  ·  3Comentarios

JanStureNielsen picture JanStureNielsen  ·  3Comentarios