Ignore certain link targets in HTML href #1186
Comments
|
I don't really want to add parcel specific things as HTML attributes. we could just make dependencies from |
|
I think you covered the pros and cons pretty well.
How about something in the filesystem? Could put a .parcelignore file to
specify certain path patterns that can be ignored.
…On Sat, Apr 14, 2018, 2:55 PM Devon Govett ***@***.***> wrote:
I don't really want to add parcel specific things as HTML attributes.
we could just make dependencies from <a href> optional, then it would
create a dependency when needed but not error if it could not resolve the
file. might be harder to debug in case you messed up a legit path though.
wdyt?
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
<#1186 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AAUAmfJNsCXiD1IpgX9oPF4b5aVopZA_ks5tonBhgaJpZM4TU2KJ>
.
|
|
I would oppose the |
|
You can temporary way In #1719 📦 Install parcel-plugin-change-file
📝 Change index.htmlAdd <body>
<!--[ <a href="/path/to/generated-report.csv">View Report</a> ]-->
</bodt>👌 OK, jump to parcel bundler<body>
<a href="/path/to/generated-report.csv">View Report</a>
</bodt>
|
Unfortunately this solution doesn't seem to work anymore. See issue Anyone has a solution? |
|
@tajchumber https://www.npmjs.com/package/parcel-plugin-asset-fourohfour Makes parcel throw a warning instead of an error for dependencies that can’t be resolved in HTML and CSS. |
|
@chrisdmacrae worked for me after a small fix. Please consider getting it into a repo so one can fork & PR. Thanks a lot for publishing it! |
|
Is something planned regarding this for Parcel 2? |
|
@bard do you mind sharing what you issue was? |
|
I got in a similar condition where I had python template inside the href attribute. <a href="{{ var_a }}">...</a>Here a snippet for ignore the error and continue the build const HTMLAsset = require('parcel-bundler/lib/assets/HTMLAsset')
function shouldIgnore (file) {
return /{{.+}}/.test(file)
}
class SkipPythonTemplateAsset extends HTMLAsset {
addDependency (name, opts) {
if (!shouldIgnore(opts.resolved)) {
return super.addDependency(name, opts)
}
}
processSingleDependency (p, opts) {
if (shouldIgnore(p)) return p
else return super.processSingleDependency(p, opts)
}
}
module.exports = SkipPythonTemplateAssetIf you use parcel with its API like me, the add the following to your build script. bundler.addAssetType('html', require.resolve('./asset.js'))Let me know whether it works. If needed I can make a plugin for that. And it should be easy to create a plugin to let the users define which kind of patterns to ignore. |
|
Also see #1719. What about a simple way to do this by prefixing the url with an "=" to indicate an exact url that should not be processed? In effect, it's like a new alias, similar to what is done with "@" or "~", etc.
I sort of hacked |
|
The goal of this is to be able to prefix an import with an '=' at the start of the path to tell parcel to just pass this url through without any processing. Is there a better way to do this? Some of the suggestions about seem a little heavy. |
Seems to be exactly what I'm looking for, but I have the following error when |
|
It looks like the plugin can't resolve parcel's built-in logger. Are you sure parcel is available in your node modules and has a lib folder? |
|
@chrisdmacrae , I'm excited to use your plugin, but I have the same problem as @caymard . In node_modules/parcel-bundler I have lib but there is no Logger folder in there. Looks like the logger was separated out into another package in Parcel 2: #2134 |
|
@tajchumber |
|
@Charbo23 I will have a look at it when I get a chance! :) |
|
Here's a patch to make parcel-plugin-asset-fourohfour not crash recent versions of parcel: https://gist.github.com/foobarbecue/2ab2fb3dd40c651aa0dacf6f1582293c but it's still replacing So I guess I'll try https://github.com/Joe-Withey/parcel-plugin-html-root-syntax from #1087 |
|
none of the solutions here works, and I want to do a redirect using a nginx-routed service on the same domain and base-path... so there is definitely nothing to bundle for Parcel 😕 I really like the idea of appending paths which should not be processed with something like a While others say that Parcel 2 is on the way... this ticket has been open for nearly two years, and I don't know how long it will take until its released and if it has this feature implemented, so a simple solution for Parcel 1 would be great. |
|
I agree, no one of plugins I have tried (including the plugin from here #1087 (comment)) works with parcel 1.12.4 However, for my need I found the following solution: Instead of <link rel="icon" href="/favicon.png">I write <script>document.write(`<link rel="icon" href="/favicon.png">`)</script>Not good, but works. |
|
I have an issue that I think is related: I am using firebase, and they have a nice local emulator for database/files/etc, and I got proxying setup with parcel: const Bundler = require('parcel-bundler')
const express = require('express')
const { createProxyMiddleware } = require('http-proxy-middleware')
const chalk = require('chalk')
const { PORT = 1234 } = process.env
const app = express()
app.use(createProxyMiddleware('/__/', {
target: 'http://localhost:5000/'
}))
const bundler = new Bundler('src/index.html')
app.use(bundler.middleware())
app.listen(Number(PORT))
console.log(`${chalk.yellow('Development Server:')} ${chalk.blue(chalk.underline(`http://0.0.0.0:${PORT}`))}`)I'd like to use their pre-configured init-object, normally at When I hit the URL directly, it works fine, but if do this in my entry-point HTML: <script defer src="/__/firebase/init.js"></script>I get |
|
As a hacky workaround, specific to react, I can use /* global fetch */
import React, { Suspense } from 'react'
import { render } from 'react-dom'
import firebase from 'firebase/app'
import { FirebaseAppProvider } from 'reactfire'
// I make it global so eval can find it
global.firebase = firebase
// this is a reusable util for Suspense + promises
function wrapPromise (promise) {
let status = 'pending'
let response
const suspender = promise.then(
(res) => {
status = 'success'
response = res
},
(err) => {
status = 'error'
response = err
}
)
const read = () => {
switch (status) {
case 'pending':
throw suspender
case 'error':
throw response
default:
return response
}
}
return { read }
}
const config = wrapPromise(fetch('/__/firebase/init.js').then(r => r.text()).then(t => eval(t)))
const FirebaseProvider = (props) => (<FirebaseAppProvider firebaseConfig={config.read().options} {...props} />)
const App = () => (
<Suspense fallback={null}>
<FirebaseProvider>
REST OF APP THAT USES reactfire HERE
</FirebaseProvider>
</Suspense>
)
render(<App />, document.getElementById('root')) |
|
Hello there, I have come here after I have the same need. So the issue is that these directories are only created at build time by the ASP project, so when I Any updates? Will this feature be in Parcel 2? |
|
I too need something similar. For many reasons, I cannot get all of my site into parcel (not parcel's fault) and of the options listed above I think I prefer are:
There was/is #448 which might warrant another look as it could be a mechanism to achieve this. |
|
there's also the option for having something like: Alternatively, we could have some sort of |
|
I'm getting this problem with href containing URLs to other websites. (with parcel 1) |
|
Is there any current solution to this? I'm trying to use parcel to bundle my cordova assets but because I need to include 'cordova.js' in my index.html it doesn't seem like I can use parcel for it? |
|
@damon-hall #1186 (comment) seems the most promising of the workarounds listed so far. It seems there's no official opinion from the parcel team how they want to handle this, so nobody has made a PR to implement any built-in mechanism, |
|
Related: #1087 (comment), #357 |
|
i think the team is focusing on version 2
https://github.com/parcel-bundler/parcel/projects/5
So let's hope that they include this feature in version 2.
Looking at that board though, I see Rust transformer, Kotlin transformer,
Reason transformer.
My worry is that Parcel 2 will be a 'Jack of all trades but master of
none'... I wish they would stick with traditional web languages and get it
right rather than handling everything.
<https://www.avast.com/sig-email?utm_medium=email&utm_source=link&utm_campaign=sig-email&utm_content=webmail>
Virus-free.
www.avast.com
<https://www.avast.com/sig-email?utm_medium=email&utm_source=link&utm_campaign=sig-email&utm_content=webmail>
<#DAB4FAD8-2DD7-40BB-A1B8-4E2AA1F9FDF2>
…On Wed, Aug 5, 2020 at 7:20 PM Niklas Mischkulnig ***@***.***> wrote:
Related: #1087 (comment)
<#1087 (comment)>,
#357 <#357>
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
<#1186 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AD3KMFPIHHAOPVYHFIKNOADR7GPIFANCNFSM4E2TMKEQ>
.
|
We don't really use Github Projects, this does not reflect our priorities.
We had these in Parcel 1 and are happy to accept contributions. The focus is still on Parcel core itself (to provide a platform for plugins) and of course the "traditional" bundler use case. |
|
This is a pretty major gotcha for anyone trying to write frontend code that interfaces with outside services sharing the same domain. I spent a while using Parcel 2 trying to find a solution to enable simple relative links in HTML such as |
|
Perhaps in Parcel 2 this could be something to add to the "ignore": [
"./lib/**/*",
"./_framework/**/*"
} |
|
Globs in "ignore": [
"./_framework/**/*",
"./_content/**/*"
] |
|
It would be really nice to have this or some way to ignore certain attributes. |
|
@davenquinn @LukeTOBrien @Xeevis @karmanyaahm may be a bit late here, but I've made a plugin that excludes assets from bundling in Parcel 2. Plugin: https://www.npmjs.com/package/parcel-resolver-ignore
{
"extends": "@parcel/config-default",
"resolvers": ["parcel-resolver-ignore", "..."]
}
{
"parcelIgnore": [
"_framework",
"_content"
]
}Now you are good to go! |
|
Any updates? Only solution provided by @VladimirMikulic worked for me with Parcel 2 |
We'd like our internal URLs to point to locations like `../end/`, not `../end/index.html`. But with Parcel.js this is actually surprisingly hard to get working, as documented here: parcel-bundler/parcel#1186 By adding the `parcel-resolve-ignore` module we can get things working, since we index all of our inputs in the magic `_all.html` file. It adds some additional output that's a little annoying but it's worth it, I think.
and others
🙋 feature request
🤔 Expected Behavior
It should be possible to write, for example:
And have Parcel ignore that URL (e.g. not report any error that it cannot resolve that file on disk).
In my case I have a similar URL that leads to a server-generated report. When Parcel sees the link to the report it complains.
😯 Current Behavior
Parcel will ignore absolute paths that include host, scheme, etc.. when processing HTML files.
Some work was also done to detect "virtual paths". The code currently will ignore a URL that has no
.in it, or its only.is in the first position. So basically it accepts a path with no file suffix.However, if you write a link as above, Parcel will report an error because the path is not "absolute" (it has no scheme) and it has a
.in it.💁 Possible Solution
Parcel continue to pile on assumptions about links to determine whether their target is expected to exist on disk at build time, for example ignore links with
#or?in them. This would work in my case, I guess, since I could add some of that noise to the link as a workaround. Or perhaps a custom prefix like///.A more robust approach would probably be preferred, though.
For example, adding a new attribute, as in
<a href="/path/to/report.csv" data-parcel-ignore>View Report</a>, would allow any link to be annotated without modification and warn Parcel not to rewrite/follow that link.Alternatively, there could be a way to specify (in an options file or on the command line) certain URL patterns which are dynamic / virtual and shouldn't be loaded by Parcel. This has some appeal because it can be applied globally rather than for every link. Users with a lot of virtual URLs can set a regular expression that excludes everything outside the specific folders that contain static resources.
🔦 Context
I am switching to Parcel from Gulp. I have a link to a dynamically generated file and Parcel is complaining that it cannot resolve the target of that link.
Note: as a workaround, I have switched to using
ng-hrefinstead ofhrefwhich parcel does ignore. So, this works because I am using angular1.x.The text was updated successfully, but these errors were encountered: