第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

如何包括位于node_modules文件夾內(nèi)的腳本?

如何包括位于node_modules文件夾內(nèi)的腳本?

慕桂英3389331 2019-10-23 16:00:14
我有一個(gè)關(guān)于node_modules納入HTML網(wǎng)站的最佳做法的問題。假設(shè)我的node_modules文件夾中有Bootstrap ?,F(xiàn)在,對(duì)于網(wǎng)站的發(fā)行版(實(shí)時(shí)版本),我將如何包括位于node_modules文件夾內(nèi)的Bootstrap腳本和CSS文件?將Bootstrap保留在該文件夾中并執(zhí)行以下操作是否有意義?<script src="./node_modules/bootstrap/dist/bootstrap.min.js></script>還是我必須在gulp文件中添加規(guī)則,然后將這些文件復(fù)制到dist文件夾中?還是最好讓gulp從我的HTML文件中完全刪除本地引導(dǎo)程序并將其替換為CDN版本?
查看完整描述

3 回答

?
精慕HU

TA貢獻(xiàn)1845條經(jīng)驗(yàn) 獲得超8個(gè)贊

通常,您不希望向外界公開服務(wù)器內(nèi)部結(jié)構(gòu)的任何內(nèi)部路徑??梢宰龅氖?scripts在服務(wù)器中建立一條靜態(tài)路由,從它們所駐留的任何目錄中獲取文件。因此,如果文件位于"./node_modules/bootstrap/dist/"。然后,頁面中的腳本標(biāo)簽如下所示:


<script src="/scripts/bootstrap.min.js"></script>

如果您對(duì)nodejs使用express,那么靜態(tài)路由就這么簡(jiǎn)單:


app.use('/scripts', express.static(__dirname + '/node_modules/bootstrap/dist/'));

然后,來自的所有瀏覽器請(qǐng)求/scripts/xxx.js都將自動(dòng)從您的dist目錄中獲取__dirname + /node_modules/bootstrap/dist/xxx.js。


注意:較新版本的NPM會(huì)將更多內(nèi)容放在頂層,而不是嵌套得太深,因此,如果您使用較新版本的NPM,則路徑名將不同于OP的問題和當(dāng)前答案中指示的名稱。但是,概念仍然相同。您可以找到文件在服務(wù)器驅(qū)動(dòng)器上的物理位置,并app.use()使用它們express.static()來創(chuàng)建這些文件的偽路徑,這樣就不會(huì)將實(shí)際的服務(wù)器文件系統(tǒng)組織暴露給客戶端。


如果您不想創(chuàng)建這樣的靜態(tài)路由,則最好將公共腳本復(fù)制到Web服務(wù)器確實(shí)視為的路徑/scripts或要使用的任何頂級(jí)名稱。通常,您可以將此復(fù)制作為構(gòu)建/部署過程的一部分。


如果您只想在目錄中公開一個(gè)特定文件,而不是在該目錄中找到所有文件,那么可以為每個(gè)文件手動(dòng)創(chuàng)建單獨(dú)的路由,而不必使用express.static()諸如:


<script src="/bootstrap.min.js"></script>

以及為此創(chuàng)建路線的代碼


app.get('/bootstrap.min.js', function(req, res) {

    res.sendFile(__dirname + '/node_modules/bootstrap/dist/bootstrap.min.js');

});

或者,如果您仍然想使用來描繪腳本的路由/scripts,則可以執(zhí)行以下操作:


<script src="/scripts/bootstrap.min.js"></script>

以及為此創(chuàng)建路線的代碼


app.get('/scripts/bootstrap.min.js', function(req, res) {

    res.sendFile(__dirname + '/node_modules/bootstrap/dist/bootstrap.min.js');

});


查看完整回答
反對(duì) 回復(fù) 2019-10-23
?
三國(guó)紛爭(zhēng)

TA貢獻(xiàn)1804條經(jīng)驗(yàn) 獲得超7個(gè)贊

我將使用路徑npm模塊,然后執(zhí)行以下操作:


var path = require('path');

app.use('/scripts', express.static(path.join(__dirname, 'node_modules/bootstrap/dist')));


查看完整回答
反對(duì) 回復(fù) 2019-10-23
?
眼眸繁星

TA貢獻(xiàn)1873條經(jīng)驗(yàn) 獲得超9個(gè)贊

如jfriend00所述,您不應(yīng)公開服務(wù)器結(jié)構(gòu)。您可以將項(xiàng)目依賴項(xiàng)文件復(fù)制到public/scripts。您可以使用dep-linker 輕松完成此操作,如下所示:


var DepLinker = require('dep-linker');

DepLinker.copyDependenciesTo('./public/scripts')

// Done


查看完整回答
反對(duì) 回復(fù) 2019-10-23
  • 3 回答
  • 0 關(guān)注
  • 885 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)