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

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

Webpack:如何直接導(dǎo)出到包含樣式表導(dǎo)入的全局(不帶.default)?

Webpack:如何直接導(dǎo)出到包含樣式表導(dǎo)入的全局(不帶.default)?

肥皂起泡泡 2021-05-13 18:16:24
語境我有一個(gè)webpack.config.js這樣的:/* Something here */module.exports = {  entry: {    main: './src/index.js'  },  output: {    library: 'MyClass',    libraryTarget: 'umd',    path: path.resolve(__dirname, 'lib'),    filename: `package.js`  },  ...}我的./src/index.js樣子是這樣的:import MyClass from 'src/myClass'import 'src/myStyle.css'export default MyClass問題盡管這可以正常工作,但它會(huì)將MyClass類公開給window對(duì)象,如下所示:console.log(window.MyClass)=> Module {default: ?, __esModule: true, Symbol(Symbol.toStringTag): "Module"}這樣,我無法通過使用以下方式調(diào)用我的班級(jí):new MyClass();=> TypeError: Slidery is not a constructor我必須像這樣調(diào)用它:new MyClass.default();=> MyClass { ... }我可以通過在我的代碼中執(zhí)行以下操作來解決該問題./src/index.js:const MyClass = require('src/myClass')module.exports = MyClass/* in browser */new MyClass()=> Good, works fine但是,通過這種方式,我無法創(chuàng)建import樣式表:const MyClass = require('src/myClass')import 'src/myStyle.css'module.exports = MyClass=> TypeError: Cannot assign to read only property 'exports' of object '#<Object>'編輯以下方法也可以解決問題,但無需使用即可完成export:/* webpack.config.js */module.exports = {  entry: {    main: './src/index.js'  },  output: {    /* Need to remove library related props */    // library: 'MyClass',    // libraryTarget: 'window',    path: path.resolve(__dirname, 'lib'),    filename: `package.js`  },  ...}/* ./src/index.js */import MyClass from 'src/myClass'import 'src/myStyle.css'window.MyClass = MyClass問題是否有針對(duì)的WebPack我的方式export直接向全球的模塊,而不必與調(diào)用.default ,并在同一時(shí)間import在入口文件樣式表?
查看完整描述

2 回答

?
qq_笑_17

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

output.libraryExport在您的中使用webpack.config.js。(參考

連同output.libraryTargetset to一起umd,output.libraryExport告訴Webpack將哪個(gè)屬性作為由命名的全局變量導(dǎo)出output.library

在你的情況下,除了原本的設(shè)定,設(shè)定output.libraryExportdefault就是等價(jià)的編譯代碼后添加以下代碼片段。

window.MyClass /*output.library*/ = module.exports.default /*output.libraryExport*/

配置如下。

/* Something here */


module.exports = {

  entry: {

    main: './src/index.js'

  },

  output: {

    library: 'MyClass',

    libraryTarget: 'umd',

    libraryExport: 'default',  // export the default as window.MyClass

    path: path.resolve(__dirname, 'lib'),

    filename: `package.js`

  }

}

在控制臺(tái)中嘗試一下。


> window.MyClass

class {...}


查看完整回答
反對(duì) 回復(fù) 2021-05-20
?
Cats萌萌

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

如果僅將腳本設(shè)計(jì)為可在Web瀏覽器中運(yùn)行,為什么不直接進(jìn)行window顯式更新:


import MyClass from 'src/myClass'

import 'src/myStyle.css'


window.MyClass = MyClass;

我認(rèn)為這比使用間接更清楚。


查看完整回答
反對(duì) 回復(fù) 2021-05-20
  • 2 回答
  • 0 關(guān)注
  • 206 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號(hào)

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