1.0.0 • Published 6 years ago

@posthtml/esm v1.0.0

Weekly downloads
2,329
License
MIT
Repository
github
Last release
6 years ago

npm node deps tests coverage code style chat

⚠️ These plugins are helpers mainly for html-loader to extract URL's and make them separate module request as ES2015 Module Imports and are not intended for general usage with posthtml. Other bundlers targeting ES2015 Modules (e.g Parcel, Rollup) may utilize them aswell, but usage besides webpack is currently untested. Feel free to open an issue if your integration requires changes

npm i -D @posthtml/esm
const posthtml = require('posthtml')
const { urls, imports } = require('@posthtml/esm')

const html = `
<img src="path/to/url.png">
<import src="path/to/import.html"></import>
`
posthtml([ urls(), imports() ])
  .process(html, { from: './src/index.html' })
  .then((result) => {
    result.html
    result.messages
  })

result.html

<img src="${HTML__URL__0}">
${HTML__IMPORT__0}

result.messages

[
  {
    type: 'import',
    plugin: '@posthtml/esm',
    url: 'path/to/url.png',
    name: `HTML__URL__0`,
    import () {
      return `import ${this.name} from '${this.url}';\n`
    }
  },
  {
    type: 'import',
    plugin: '@posthtml/esm',
    url: 'path/to/import.html',
    name: `HTML__IMPORT__0`,
    import () {
      return `import ${this.name} from '${this.url}';\n`
    }
  }
]

urls

NameTypeDefaultDescription
url{RegExp\|Function}''Filter URL's

{RegExp}

urls({
  url: /filter/
})

{Function<{String} -> {Boolean}>}

urls({
  url (url) {
    return /filter/.test(url)
  }
})

imports

NameTypeDefaultDescription
import{RegExp\|Function}''Filter Import URL's
template{String}''Placeholder for HTML Templates

{RegExp}

imports({
  import: /filter/
})

{Function<{String} -> {Boolean}>}

imports({
  import (url) {
    return /filter/.test(url)
  }
})