
Security News
Oracle Drags Its Feet in the JavaScript Trademark Dispute
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
rollup-plugin-import-assert
Advanced tools
A Rollup plugin to add import assertion behavior and syntax support
🍣 A Rollup plugin which enables import assertions for top-level CSS and JSON modules.
This package is available on the npm registry under the name rollup-plugin-import-assert
and can be installed with npm, yarn or however else you consume dependencies.
npm:
npm i -D rollup-plugin-import-assert
yarn:
yarn add -D rollup-plugin-import-assert
Once the plugin is installed, you will also need to make sure you have the acorn-import-assertions
package installed. You can then add both items to your Rollup configuration as below:
import { importAssertionsPlugin } from 'rollup-plugin-import-assert';
import { importAssertions } from 'acorn-import-assertions';
export default {
input: 'path/to/file.js'
output: {
format: 'esm',
dir: 'lib' // only necessary to enable dynamic imports
},
acornInjectPlugins: [ importAssertions ],
plugins: [ importAssertionsPlugin() ]
}
These two plugins will enable the import assertion syntax and behavior in your Rollup build. In your input file, you can import files using type assertions as follows:
import styles from './styles.css' assert { type: 'css' };
class MyCustomElement extends HTMLElement {
connectedCallback() {
const root = this.attachShadow({ mode: 'open' });
root.innerHTML = `<h1>Hello world</h1>`;
root.adoptedStyleSheets = [ styles ];
}
}
customElements.define('my-custom-element', MyCustomElement);
Assuming valid CSS in styles.css
, the contents of the the CSS will be transformed to use CSS module scripts for use with DocumentOrShadowRoot.prototype.adoptedStyleSheets
. Currently this API only exists in Chrome, but a polyfill exists to port the behavior back to IE11.
This plugin will ignore dynamic imports with dynamic values, e.g.:
import(`./foo/${bar}.json`, { assert: { type: 'json' } }); // will be ignored
const foo = './foo.json';
import(foo, { assert: { type: 'json' } }); // will be ignored
FAQs
A Rollup plugin to add import assertion behavior and syntax support
We found that rollup-plugin-import-assert demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
Security News
The Linux Foundation is warning open source developers that compliance with global sanctions is mandatory, highlighting legal risks and restrictions on contributions.
Security News
Maven Central now validates Sigstore signatures, making it easier for developers to verify the provenance of Java packages.