I am fairly new to rollup and I have an issue with transpiling/compiling a library where there are multiple input files where many of the files contain duplicate constant names.
My rollup.config.js:
import multiEntry from "rollup-plugin-multi-entry"
import babel from "rollup-plugin-babel"
export default {
input: __dirname + "/src/*.js",
plugins: [
babel({}),
multiEntry()
],
output: {
file: __dirname + "/lib/main.js",
format: "esm",
}
}
Many of the source files contain constants named ENTITY_NAME:
export const ENTITY_NAME = "entity1name"
export const ENTITY_NAME = "entity2name"
When I run rollup, I get the following warning:
rollup-plugin-multi-entry:entry-point re-exports 'ENTITY_NAME' from both packages\common\blah\src\entityOne.js and packages\common\blah\src\entityTwo (will be ignored)
... so the resulting main.js does not contain ENTITY_NAME.
How do I get around this? It would the only two possible solutions would be to output to:
Individual files,
A single file containing each input file compiled separately.
I have looked for how to configure either of these solutions, but I cannot find anything. Can anyone suggest a solution?
Solved. I needed to add the following to my rollup.config.js: -
preserveModules: true,
Related
I'm using the rollup plugin strip to exclude the console.logs in the production built with following settings
plugins: [
strip({
include: ['**/*.(js|svelte)'],
labels: ['dev'],
functions: ['console.log'],
})
]
I now have the situation that I would like to keep one special log in production. So I created a function in a new file logInProduction.js
export function logInProduction(msg) {
console.log(msg)
throw new Error('PRODUCTION')
}
and added the file to the plugin options by adding this line
exclude: ['logInProduction.js'],
But when calling the function, the error is thrown, so the function was called, but the log before doesn't appear.
Is this because the .js ending is generally included before so the specific exclusion doen't have any effect? Is it possible to do this?
Or is there another maybe better way to keep one specific console.log?
Problem was, that the filename was missing the directory, so
exclude: ['src/utils/logInProduction.js'],
or
exclude: ['**/logInProduction.js'],
does work
I'm building a sveltekit project. One thing I've done is created a custom type of file which is converted to a *.svelte file upon building or running the development server. By default, sveltekit includes the rollup extension rollup-plugin-dynamic-import-variables which is trying to parse my custom file (who knows why?) and throwing an "unexpected token" error. I'm trying to configure that extension to ignore my custom files, but so far without success. Here is my attempted svelte.config.js file:
// #type {import('#sveltejs/kit').Config}
var config;
import adapter from '#sveltejs/adapter-static';
import dynamicImportVariables from 'rollup-plugin-dynamic-import-variables';
config = {
kit: {
// --- hydrate the <div id="svelte"> element in src/app.html
target: '#svelte',
adapter: adapter({
pages: 'build',
assets: 'build',
fallback: null
}),
vite: {
plugins: [
dynamicImportVariables({
warnOnError: true,
exclude: '**'
})
]
}
}
};
export default config;
To be honest about it, I don't use dynamic imports anywhere and therefore would accept as a solution the complete disabling of the extension. But anything that would get it to ignore my custom files would also work.
UPDATE: SvelteKit 1.0.0-beta now requires pages/endpoints to follow a specific naming pattern, so explicit file exclusion should no longer be needed.
SvelteKit specially handles files in the routes/ directory with the following filenames (note the leading + in each filename):
+page.svelte
+page.js
+page.server.js
+error.js
+layout.svelte
+layout.js
+layout.server.js
+server.js
All other files are ignored and can be colocated in the routes/ directory.
If, for some reason, you need to have a file that has a special name shown above, it's currently not possible to exclude that file from special processing.
Original outdated answer:
The rollup-plugin-dynamic-import-variables is actually included by Vite. To configure Vite's plugin, set the build.dynamicImportVarsOptions property:
// svelte.config.js
/** #type {import('#sveltejs/kit').Config} */
const config = {
kit: {
// hydrate the <div id="svelte"> element in src/app.html
target: "#svelte",
vite: {
build: {
dynamicImportVarsOptions: {
exclude: [/node_modules/, /\.starbucks$/],
},
},
},
},
}
export default config
But that's not going to fix the problem...
SvelteKit processes all files under src/routes/ so that they're automatically imported in the output application (in .svelte-kit/build/app.js), which will result in the same error.
Option 1: Private modules
You could exclude a src/routes/*.starbucks file by making it a private module, which has a leading underscore in the filename:
src/routes/_home.starbucks 👈
src/routes/_index.starbucks 👈
src/routes/index.svelte
Option 2: Move files outside src/routes
Alternatively, move those *.starbucks files outside of src/routes/ (e.g., into src/starbucks/ or src/lib/):
src/routes/index.svelte
src/starbucks/home.starbucks 👈
src/starbucks/index.starbucks 👈
src/lib/home.starbucks 👈
src/lib/index.starbucks 👈
I have a browser application written in Dart. I noticed a strange error appearing where my StageXL ResourceManager was missing the resources that it previously had. After debugging the program for a while I ended up with this situation:
In global.dart:
class Global {
static final ResourceManager resourceManager = new ResourceManager();
}
In main function:
var resources = Global.resourceManager;
resources.addBitmapData("Player", "images/player_base.png");
await resources.load();
print("in main: ${identityHashCode(Global.resourceManager)} = "
" ${Global.resourceManager.resources}, isolate: ${identityHashCode(
Isolate.current)}");
In another function where I need to access the resource afterwards:
print("elsewhere: ${identityHashCode(Global.resourceManager)} = "
" ${Global.resourceManager.resources}, isolate: ${identityHashCode(
Isolate.current)}");
Expected output (identityHashCodes match and so do the object contents):
in main: 12345678 = [ResourceManagerResource [kind=BitmapData, name=Player,
url = images/player_base.png]], isolate: 09876543
elsewhere: 12345678 = [ResourceManagerResource [kind=BitmapData,
name=Player, url = images/player_base.png]], isolate: 09876543
Actual output (note the identityHashCode mismatch):
in main: 516570559 = [ResourceManagerResource
[kind=BitmapData, name=Player, url = images/player_base.png]],
isolate: 843028171
elsewhere: 419835243 = [], isolate: 843028171
I thought this may have something to do with running in a different isolate (not familiar with them) but as you can see, the current isolates identityHashCodes match.
That is surprising. My best guess is that you are importing the same library twice, using different URIs. The fact that one of your files is a "main" file supports this, since its a common mistake to specify the main file on the command line as a file and have it import a package library using a relative reference.
Is your "main" file in a package lib directory, and does it import the resource file using a relative path? If so, try changing that import to a package:packageName/thepath URI instead and see if it changes anything.
(My personal recommendation is to never have a Dart library URL that contains lib, whether in an import/export or on the command line. Always use a package: URI in that case instead.)
I would like to ask a question about CommonsChunkPlugin
const path = require('path');
const webpack = require('webpack');
module.exports = {
entry: {
vendor: ['moment'],
app: ['./www/build/main.js']
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].bundle.js'
},
module: {
rules: [
{ test: /\.(js)$/, use: 'babel-loader' }
]
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'chunk'
})
]
}
After i run the webpack script, there are 3 files generated (vendor.bundle, app.bundle, chunk.bundle). My questions are:
What is the usage chunk.bundle and why it is generated? I set the config in "entry" and output is depends on the [name] of entry
How can i run the script to all files under a folder? The current setting needs to input one by one.
If my file is too large, how can i split is into some smaller files?
Thanks.
1) The chunk.bundle.js is being generated by the plugin. It operates a little outside of the usual Webpack flow.
2) Not sure what you're getting at, here. You probably need to look at the minChunks setting, or chunks.
3) You can use multiple instances of the plugin. I've found that you have to use the chunks setting on every instance except for one to avoid getting an error. Basically that specifies on what entry files the plugin will operate. You can specify all your entry files in chunks, and then use a function with minChunks to filter out what you want to include in that file.
I have a problem implementing a cross domain custom build in Dojo.
The situation is as follows: i have a pretty large application, with a good number of localisation bundles, so basicly the directory structures is like
core\ (my module)
nls\
fr\
en\
....
When building my module the result is a big core.js/core.xd.js file, which, bien sur, does not contain the localisations. In the localisation nls directories (en/fr/etc) i find after the build each bundle builded/minified, and a bigger file for each language, core_fr.js/core_en.fs, which contains only Dojo/Dijit related strings.
so my build script is
layers: [
{
resourceName: "core",
name: "../core/trusted.js",
dependencies: [
"dojo.i18n",
//data
"dojox.data.JsonRestStore",
"dojox.data.XmlStore",
"dojox.rpc.Service",
"dojox.form.FileInput",
...
"core.controller.Fusebox"
],
prefixes: [
["dijit","../dijit"],
["dojox","../dojox"],
["core", "../core"]
]
In the core.controller.Fusebox class i try to load 1 nls
dojo["requireLocalization"]("core", "FuseboxContent");
here it will die, however with
availableFlatLocales is undefined
[Break on this error] var locales = availableFlatLocales.split(",");\r\n
My config in the html file is :
// version build
var djConfig = {
baseUrl: 'https://..../',
modulePaths: { 'core': 'core'},
useXDomain: true,
xdWaitSeconds: 10,
parseOnLoad: true,
afterOnLoad: true,
// debugAtAllCosts: true,
isDebug: true,
locale: "fr"
};
and then
<script type="text/javascript" src="http://xd.woopic.com/dojoroot/1.3.2-xd/dojo/dojo.xd.js.uncompressed.js"></script>
<script type="text/javascript" src="https://..../core/trusted.js.uncompressed.js"></script>
I used the uncompressed for debug, of course.
The problem is that, on runtime, Dojo tries to load my bundles and can not find them, and i would like to embed them in my layer file, so no extra loads will be required.
Can this be achieved? And while we're at it, are there any working sites/examples with cross domain localisations?
UPDATE: i continued my analysis and the problem seems to lay in the fact that i am dynamicaly loading nls, so the build parser can not find the requireLocalization() calls. Therefore the project nls file contains only dojo/dijit related content. However, i added a few bundle loads in a dummy file, and the content of core/nls is still ignored by the builder.
Thanks for any info, i am pretty much at the end of my searches, there isn't much on the net on this subject.
I had a similar issue a few days ago. First of all, you can get around the error by setting the available locales as the 4th parameter of the requireLocalization call.
e.g.
dojo.requireLocalization("core", "FuseboxContent", null, "en,fr");
though you should not have to do that.
Did you try including the localization as follows?
dojo.requireLocalization("core", "FuseboxContent"); // and not dojo["require..."]