Modifica all'uso del bootstrap via npm

Sto lavorando a un progetto che attualmente utilizza il bootstrap. Tuttavia questo è stato fatto caricando i file di bootstrap in una sottodirectory. Mi piacerebbe passare a utilizzare npm in quanto ciò renderà molto più facile tenersi aggiornati.Modifica all'uso del bootstrap via npm

nostra cartella esistente style include bootstrap e source come sottocartelle + un index.js di file:

var ms = require('ms'); 
var join = require('path').join; 
var less = require('transform')('less'); 
var express = require('express'); 
var app = express(); 

.............*other code* 

app.get('/bootstrap.css', less(join(__dirname, 'source', 
            process.env.COMPANY_ID + '-root.less'))); 
app.get('/print.css', less(join(__dirname, 'source', 
           process.env.COMPANY_ID + '-print.less'))); 

module.exports = app;

nella cartella di origine abbiamo poi un certo numero di .less file tra cui un company-root.less che importa vari file meno:

@import "./bootstrap/bootstrap.less";  
@import "./variables/all.less"; 
@import "./variables/company.less"; 
@import "./customcss.less";  
@import "./subnav.less";  
@import "./nav-list.less";

Ho aggiunto bootstrap a package.json ed eseguito npm install, quindi avere bootstra p nella cartella node_modules, ma non è possibile far funzionare il progetto con i nuovi file. Ho provato a mettere

var $ = require('jQuery'); 
global.jQuery = $; 
require('bootstrap');

in index.js Questo mi dà un errore:

TypeError: Cannot set property 'emulateTransitionEnd' of undefined 
    at C:\Users\Dee\Documents\GitHub\MAPS\node_modules\bootstrap\js\transition.js:36:29

Ho provato a cambiare la prima linea di company-root.js a:

@import (npm) "bootstrap";

@import "../../node_modules/bootstrap/less/bootstrap.less";

ma questo non ha alcuna formattazione.

Ho passato tre ore a pescare in rete ma non sto facendo progressi. Qualcuno mi può aiutare per favore?

fonte

2015-07-27 Dee Lindesay

io penso che si debba usare una libreria come bootstrap-sass-loader o bootstrap-webpack.

questo funziona in alcuni casi, ma non in tutte le configurazioni WebPack

global.jQuery = global.$ = require('jquery'); 
require('bootstrap');

fonte

2016-07-15 20:02:32 BishopZ

stavo ricevendo questo errore pure. Stavo lavorando su una piccola demo che richiedeva il bootstrap nell'HTML e stavo tentando di caricare il bootstrap nel file .js usando lo require(bootstrap).

Ho rimosso il require(bootstrap0 dal file .js.

sono andato al mio HTML e solo aggiunto bootstrap al <head> in questo modo:

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> 
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

Il mio file js è questo:

var app = require('express')(); 
var http = require('http').Server(app); 
var io = require('socket.io')(http); 
global.jQuery = require('jquery');

Ran il mio progetto e ha funzionato bene. L'errore è andato via. Mi rendo conto che questo potrebbe non essere quello che stavi cercando, ma volevo pubblicare la mia soluzione nel caso in cui qualcun altro stia ricevendo quel messaggio di errore.

fonte

2017-07-20 20:13:31 Flea

Modifica all'uso del bootstrap via npm

risposta

Problemi correlati