Experiments

@sokra

Build HTTP (Modules?)
- importMap in HTML Support
- Allow to specify a resolver function to resolve (bare) imports in HTTP Module (@sokra ?)
- forceLock to force locking Cache-Control: no-cache resources.
- minCacheDuration to allow to override very short Cache-Control headers.

Is it possible to refer to importmap?

https://stackoverflow.com/questions/76309809/how-can-i-configure-webpack-to-use-external-javascript-module

@benlieb

@benlieb You can use the import field in your package.json https://nodejs.org/api/packages.html#subpath-imports

@alexander-akait

@alexander-akait I'm not sure this solves the problem I'm having. It would be great if it did though!

I have a writeup on SO: https://stackoverflow.com/questions/76309809/how-can-i-configure-webpack-to-use-external-javascript-module

@benlieb

@benlieb Okay, you can:

parse HTML and extract importmap
convert "imports" to externals

You need to get:

externals: {
  constants: "import http://localhost:3000/assets/constants.js"
},

Note - webpack will use import(...) (we have other externals types, follow our docs to look find other possible values if you need) so if you need to support very old envs you need to think about other ways

Thank you for your help, I really need it. But I still don't understand.

Why would I use

externals: {
  constants: "import http://localhost:3000/assets/constants.js"
},

When it is already loaded in to the browser with:

<script type="importmap">
  {
    "imports": {
      "constants": "http://localhost:3000/assets/constants.js"
    }
  }
</script>

I thought the following would work with this:

module.exports = {
 externals: {
  constants: 'module constants',
 }
}

But guess not?

One complicating factor is that the url for the import map is actually dynamically generated with hashes (url changes when file contents change) via a rails view helper and really looks like this:

<script type="importmap">
  {
    "imports": {
      "constants": "http://localhost:3000/assets/rails-constants-0ac54660d36cd34c7e89b718a2521795e9a894af62143d83adcf0a786ee8badf.js"
    }
  }
</script>

That url isn't hard-codeable into my webpack config file.

Is there any other way that using the import type in the webpack config?

What is http://localhost:3000/assets/rails-constants-0ac54660d36cd34c7e89b718a2521795e9a894af62143d83adcf0a786ee8badf.js format? Maybe you can a create github repo with an example of code and how you run, because your solution should work too

Also please run npm ls webpack (we should have webpack v5)

Looks like maybe webpacker is too old:

threadable-api@0.1.0 /Users/benlieb/code/th/threadable_api
├─┬ @rails/webpacker@5.4.3
│ ├─┬ compression-webpack-plugin@4.0.1
│ │ └── webpack@4.46.0 deduped
│ ├─┬ css-loader@3.6.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ file-loader@6.2.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ mini-css-extract-plugin@0.9.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ optimize-css-assets-webpack-plugin@5.0.8
│ │ └── webpack@4.46.0 deduped
│ ├─┬ sass-loader@10.1.1
│ │ └── webpack@4.46.0 deduped
│ ├─┬ style-loader@1.3.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ terser-webpack-plugin@4.2.3
│ │ └── webpack@4.46.0 deduped
│ ├─┬ webpack-assets-manifest@3.1.1
│ │ └── webpack@4.46.0 deduped
│ ├─┬ webpack-cli@3.3.12
│ │ └── webpack@4.46.0 deduped
│ └─┬ webpack@4.46.0
│   └─┬ terser-webpack-plugin@1.4.5
│     └── webpack@4.46.0 deduped
├─┬ babel-loader@8.2.3
│ └── webpack@4.46.0 deduped
└─┬ webpack-dev-server@3.11.3
  ├─┬ webpack-dev-middleware@3.7.3
  │ └── webpack@4.46.0 deduped
  └── webpack@4.46.0 deduped

The format of the js file is like:

export const CIRCLE_VISIBILITY_TYPES = {"OPEN":"open","PUBLIC":"public","EXPERT":"expert","SOLO":"solo","PRIVATE":"private"};

@benlieb

@benlieb Yeah, this explains why your solution didn't work, make sense to migrate https://github.com/rails/jsbundling-rails/, if it is not possible you can try to proxy some requests on request URLs

We are deciding between that and shakpacker. Thank you for your time. Very appreciated! I'll check in when we have progress!

This issue had no activity for at least three months.

It's subject to automatic issue closing if there is no activity in the next 15 days.

Issue was closed because of inactivity.

If you think this is still a valid issue, please file a new issue with additional information.

Navigation Menu

Repository navigation

Experiments #17123

11 remaining items

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

Experiments #17123

Description

Activity

benlieb commented on May 22, 2023

alexander-akait commented on May 22, 2023

benlieb commented on May 22, 2023

alexander-akait commented on May 22, 2023

benlieb commented on May 22, 2023

alexander-akait commented on May 22, 2023

benlieb commented on May 22, 2023

benlieb commented on May 22, 2023

alexander-akait commented on May 22, 2023

benlieb commented on May 22, 2023

webpack-bot commented on Aug 22, 2023

webpack-bot commented on Sep 6, 2023

11 remaining items

Metadata

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

Issue actions