Comments (15)
to reproduce ...
$ fresh init wxyz
$ cd wxyz
$ code .
opened routes.gen.ts
// DO NOT EDIT. This file is generated by `fresh`.
// This file SHOULD be checked into source version control.
// To update this file, run `fresh routes`.
import * as $0 from "./pagesyz/pages/api/joke.ts";
import * as $1 from "./pagesyz/pages/index.tsx";
import * as $2 from "./pagesyz/pages/[name].tsx";
const routes = {
pages: {
"./pagesyz/pages/api/joke.ts": $0,
"./pagesyz/pages/index.tsx": $1,
"./pagesyz/pages/[name].tsx": $2,
},
baseUrl: import.meta.url,
};
export default routes;
Note: the extra folder is named ... pages + ${ the last 2 characters of the parent folder name }
this is reproduceable for any folder name given to fresh init
from fresh.
also ...
error in ./pages/[name].tsx line 8
return <div>Hello {props.params.name}</div>;
the 'div' tags are highlighted red and the error message is ...
JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.deno-ts(7026)
from fresh.
I think I encountered this error before. I can no longer reproduce it on macOS. Can you confirm if re-installing fresh doesn't fix it?
deno install -A -f --no-check --reload -n fresh https://raw.githubusercontent.com/lucacasonato/fresh/main/cli.ts
from fresh.
@satyarohith reinstall did not fix (win10)
I did a local fix and tested (OK)
routes.ts ...
// line # 51 added 2 to the href.length
// from this
const file = toFileUrl(entry.path).href.substring(pagesUrl.href.length);
// to this
const file = toFileUrl(entry.path).href.substring(pagesUrl.href.length + 2);
// line # 60 removed '/pages'
// from this
${files.map((file, i) => `import * as $${i} from "./pages${file}";`).join("\n")}
// to this
${files.map((file, i) => `import * as $${i} from ".${file}";`).join("\n")}
// line # 65 removed '/pages'
// from this
files.map((file, i) => `${JSON.stringify(`./pages${file}`)}: $${i},`)
// to this
files.map((file, i) => `${JSON.stringify(`.${file}`)}: $${i},`)
from fresh.
@satyarohith I found this
the ...
toFileUrl(entry.path)
added two extra //
href: "file:///C:/...
these are then negated by the ...
href.substring(pagesUrl.href.length + 2);
from fresh.
routes.ts line # 43
// in windows ... this works ...
const pagesUrl = new URL( "file:///" + pagesDir);
// returns "file:///C:/Users/nhron/....."
// this does not ...
const pagesUrl = new URL( pagesDir, "file:///")
// returns "c:\Users\nhron\....."
This allows the lengths to match and then all works well.
can you test if this is not the case in linux/mac?
Since new URL()
is a core Deno function, this may be the cause of other issues with Deno in Win10?
from fresh.
@satyarohith ... new URL()
in Chrome-v8 ...
<script>
console.log(new URL("c:/docs", "file:///"))
</script>
returns file:///C:/docs
in Deno ...
console.log(new URL("c:/docs", "file:///"))
returns c:/docs
Is Deno URL not browser compat? I can see this creating many ;Deno-Windows; Issues!
from fresh.
This is a deno issue. Once deno URL starts passing all tests, this issue will go away.
from fresh.
// routes.ts line 43
// Currently this does not work in Windows10 as Deno URL() constructor is not passing test!
const pagesUrl = new URL( pagesDir, "file:///")
// pagesUrl will be 'c:/...'
// if we change line 43 to this, everything works as designed.
const pagesUrl = toFileUrl(new URL(pagesDir).href)
// pagesUrl will be 'file:///c:/...' and then will return proper relative path at line 51
// I think this is what was intended to begin with
from fresh.
I've confirmed the issue is Windows10...
VS Code in WSL-Windows-bash(ubuntu)
> fresh routes ->
Route manifest generated and written to /home/ndh/projects/courses/test/routes.gen.ts
new URL(url, base) will see the above url as 'relative' and so, will add the base 'file:///'
pages: {
"./pages/api/joke.ts": $0,
"./pages/index.tsx": $1,
"./pages/[name].tsx": $2,
}
VS Code in native-Windows-Powershell
> fresh routes ->
Route manifest generated and written to C:\Users\nhron\Documents\Work\ACTIVE\test\routes.gen.ts
new URL(url, base) sees the above url as absolute, so it will ignore the base 'file://'
pages: {
"./pagesst/pages/api/joke.ts": $0,
"./pagesst/pages/index.tsx": $1,
"./pagesst/pages/[name].tsx": $2,
}
by the way... Chrome/Win10 new URL() will use the 'base' even if the url is absolute!!!
This is not to spec, where node and deno will honor the spec.
from the Web/API/URL docs
@url param = a string or an element — that represents an absolute or relative URL.
If url is a relative URL, base is required,
[@base] param = If url is an absolute URL, a given base will be ignored.
from fresh.
@nhrones Thanks for all the info. I have not yet tested fresh on windows - I'll make sure it is all working soon.
from fresh.
from fresh.
routes.ts
The new URL() constructor on line#43, will ignor its second param 'file:///', when the first is param is an absolute path.
Deno.cwd() will return an absolute path with a drive letter in Win32.
So, on line #51 the toFileURL() does not seem to care about absolute path and will
return a true 'file:///...' href which makes the substring on that line inacurate.
The fix at least on Win32, is to subString the final toFileURL.href result to
extract the correct relative path.
Since '/pages/' is a constant, you can get the relative path from 'toFileURL.href.lastIndexOf('pages')'
// old line 51
const file = toFileUrl(entry.path).href.substring(pagesUrl.href.length);
// two new lines to replace above
const fileUrl = toFileUrl(entry.path).href // added this extra step to improve readability
const file = fileUrl.substring(fileUrl.lastIndexOf('pages'));
This will also require the removal of the now redundant 'pages' text on lines #60 and #65
// line 60 will now have a redundant pages
${files.map((file, i) => `import * as $${i} from "./pages${file}";`).join("\n")}
// changed to
${files.map((file, i) => `import * as $${i} from "./${file}";`).join("\n")}
// same with line 65
from fresh.
Closing as there seems to be a lack of interest in supporting Windows. Using windows? Don't use fresh!
from fresh.
This issue should be re-open. it is still happening
from fresh.
Related Issues (20)
- docs: explain better the distinction between islands and components HOT 5
- Can't see unminified Preact source code in Chrome debugger
- Fresh updater fails when deno.jsonc is in parent folder HOT 1
- Support React as alternative to Preact HOT 5
- CSP nonce issue?
- dangerouslySetInnerHTML usage in <head> breaks style plugins HOT 6
- Is the way you collect statistics GDPR-compliant? HOT 3
- Hooks stop working when importing npm modules HOT 5
- Docs: code in snippet is wrong
- Conditional Island Children HOT 2
- Easy way to augment esbuild configuration HOT 4
- @tabler/icons-preact error on islands component and dev mode HOT 1
- [bug] deno compile binary does not work on other machines HOT 1
- Hook is already inside component, yet error `Hook can only be invoked from render methods` still occurs HOT 1
- Client Address Bar wont update after 303 redirect response. HOT 4
- JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. || pragmaFrag cannot be set when runtime is automatic HOT 2
- [Bug] Preact's hydrate will clear uncontrolled property(e.g.`defaultValue) HOT 1
- [bug] partial on form submit
- ReadableStream.from not supported if a fresh app is a subfolder HOT 6
- Tailwind plugin wanders into `scss` files then crashes on build
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fresh.