Rollup.js - 从包中排除模块
Rollup.js - Exclude module from bundle
我遇到了无法正确配置 rollup.config.js 的问题。我想从捆绑中排除 libModule.js 模块。到目前为止,我已经尝试了很多配置和设置,但都没有成功。有人可以帮帮我吗
这是我的文件夹结构。
my-folder
└────src
│ └───index.ts
│ └───libModule.js
│
└────dist
│ └───bundle.js
│
└───rollup.config.js
index.ts
import $ from './libModule';
container.appendChild(
$.element('img', { id: 'image', src: '9592/test_1.png', style: '' })
);
libModule.js
export default function $(e) {
return document.getElementById(e)
}
...
rollup.config.js
import path from 'path';
import typescript from 'rollup-plugin-typescript2';
const externalId = path.resolve(__dirname, './src/libModule.js');
export default {
input: './src/index.ts',
output: {
file: './dist/bundle.js',
format: 'iife',
name: 'sco',
sourcemap: true,
interop: false,
globals: {
[externalId]: '$'
}
},
external: [externalId],
plugins: [
typescript({
typescript: require('typescript'),
})
],
}
tsconfig.json
{
"compilerOptions": {
"outDir": "./dist",
"module": "es6",
"noImplicitAny": true,
"sourceMap": true,
"target": "es5",
"allowJs": true,
"moduleResolution": "node"
},
"include": [
"src/**/*"
],
"exclude": ["node_modules"],
"typedocOptions": {
"inputFiles": [".src/**/*"],
"mode": "modules",
"out": "docs",
"readme": "none"
}
}
问题是您需要将正确的标识符标记为外部标识符。
您需要使用正确的 url 处理每个导入,因此如果您从不同的 url 或位置导入相同的模块,您需要将所有模块标记为外部
import ex from './ex.js'
import ex from '../modules/ex.js'
等将它们视为字符串值
我遇到了无法正确配置 rollup.config.js 的问题。我想从捆绑中排除 libModule.js 模块。到目前为止,我已经尝试了很多配置和设置,但都没有成功。有人可以帮帮我吗
这是我的文件夹结构。
my-folder
└────src
│ └───index.ts
│ └───libModule.js
│
└────dist
│ └───bundle.js
│
└───rollup.config.js
index.ts
import $ from './libModule';
container.appendChild(
$.element('img', { id: 'image', src: '9592/test_1.png', style: '' })
);
libModule.js
export default function $(e) {
return document.getElementById(e)
}
...
rollup.config.js
import path from 'path';
import typescript from 'rollup-plugin-typescript2';
const externalId = path.resolve(__dirname, './src/libModule.js');
export default {
input: './src/index.ts',
output: {
file: './dist/bundle.js',
format: 'iife',
name: 'sco',
sourcemap: true,
interop: false,
globals: {
[externalId]: '$'
}
},
external: [externalId],
plugins: [
typescript({
typescript: require('typescript'),
})
],
}
tsconfig.json
{
"compilerOptions": {
"outDir": "./dist",
"module": "es6",
"noImplicitAny": true,
"sourceMap": true,
"target": "es5",
"allowJs": true,
"moduleResolution": "node"
},
"include": [
"src/**/*"
],
"exclude": ["node_modules"],
"typedocOptions": {
"inputFiles": [".src/**/*"],
"mode": "modules",
"out": "docs",
"readme": "none"
}
}
问题是您需要将正确的标识符标记为外部标识符。 您需要使用正确的 url 处理每个导入,因此如果您从不同的 url 或位置导入相同的模块,您需要将所有模块标记为外部
import ex from './ex.js'
import ex from '../modules/ex.js'
等将它们视为字符串值