如何结合使用NodeResolve和IncludePaths插件进行浏览器捆绑?

问题描述

我想解析myPackage / node_modules目录,并为某些自动生成的脚本(例如import {} from 'onewww.appSupport'而不是import {} from '../../onewww.autoGenerated/appSupport/package.js'提供模块别名。

我无法编译示例汇总项目:

  • 对于我的包com.siteblade.intl,将导入Node.js文件而不是等效的浏览器文件。我在rollup.config.js中指定NodeResolve()。browser = true。在其他Rollup项目中,该com.siteblade.intl软件包可以在浏览器模式下很好地编译。
  • 警告:
  • Node.js模块(例如path,fs和url)将被导入,但是我的应用程序代码和本地导入的脚本不会将其导入。安装了适用于浏览器汇总构建的NPM依赖项。

rollup.config.js

import svelte from 'rollup-plugin-svelte';

import NodeResolve from '@rollup/plugin-node-resolve';

import Commonjs from '@rollup/plugin-commonjs';

import RollupJSON from '@rollup/plugin-json';

import LiveReload from 'rollup-plugin-livereload';

import { terser as Terser } from 'rollup-plugin-terser';

import Autopreprocess from 'svelte-preprocess';

import IncludePaths from 'rollup-plugin-includepaths';

import * as ChildProcesses from 'child_process';

const inProduction = !process.env.ROLLUP_WATCH;

function serverFn() { /* ... */ }

export default {

    input: 'src/app/Application.js',output: {
        sourcemap: true,format: 'iife',name: 'qux',file: 'onewww.autoGenerated/final/js/Application.js',},plugins: [
        IncludePaths({
            include: {
                "onewww.appSupport": "onewww.autoGenerated/appSupport/package.js"
            },paths: ["src"],external: [],extensions: ['.js','.svelte'],}),RollupJSON(),svelte({
            // enable run-time checks when not in production
            dev: !inProduction,// we'll extract any component CSS out into
            // a separate file - better for performance
            css: css => {
                css.write('onewww.autoGenerated/final/css/Application.css');
            },preprocess: Autopreprocess(),NodeResolve({
            browser: true,dedupe: ['svelte'],preferBuiltins: false,Commonjs(),!inProduction && serverFn(),!inProduction && LiveReload('wwwroot'),inProduction && Terser({ module: true }),],watch: {
        clearScreen: false
    }
};

package.json

{
    "devDependencies": {
        "@rollup/plugin-commonjs": "^12.0.0","@rollup/plugin-json": "^4.1.0","@rollup/plugin-node-resolve": "^8.0.0","animation-timer": "^1.0.12","axios": "^0.19.2","bootstrap": "^4.5.0","com.siteblade.browser": "^1.0.0","cors": "^2.8.5","events": "^3.2.0","jquery": "^3.5.1","popper.js": "^1.16.1","rollup": "^2.3.4","rollup-plugin-livereload": "^1.0.0","rollup-plugin-includepaths": "^0.2.4","rollup-plugin-svelte": "^5.0.3","rollup-plugin-terser": "^5.1.2","sass": "^1.26.10","svelte": "^3.0.0","svelte-feather-icons": "^3.2.2","svelte-navigator": "^3.0.9","svelte-preprocess": "^4.0.8","sveltestrap": "^3.7.3"
    },"dependencies": {
        "rollup-plugin-postcss": "^3.1.3","polka": "next","sirv": "^1.0.0"
    }
}

在我的示例项目中,属于Node.js的脚本很少,并且这些脚本不是由应用程序代码导入的,也没有导入Node.js API的。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)