remoteinterview / zero Goto Github PK

My use case here is that in dev mode I'd like to be able to run:

var openBrowser = require('react-dev-utils/openBrowser')

if (openBrowser('http://localhost:3000')) {
  console.log('The browser tab has been opened!');
}

after the server has created the manifest.

Essentially I'm looking for some sort of lifecycle hooks or events to run code before or after.

It would be nice, if .jsx files were served by zero with a content-type: text/html header.

It's required for example by Twitter to generate cards (https://cards-dev.twitter.com/validator) and adding it in a different way (<meta> tag, apache config, ...) is an ugly workaround.

Is it on the roadmap to add support for CSS and Sass files?

Would be cool to have Svelte support. Happy to attempt a PR once 3.0 is final, assuming it will be accepted.

VPS information: DigitalOcean, CentOS

Error log:
/usr/lib/node_modules/zero/lib/index.js:85
return new Promise(async (resolve, reject) => {
^

SyntaxError: Unexpected token (
at createScript (vm.js:56:10)
at Object.runInThisContext (vm.js:97:10)
at Module._compile (module.js:549:28)
at Object.Module._extensions..js (module.js:586:10)
at Module.load (module.js:494:32)
at tryModuleLoad (module.js:453:12)
at Function.Module._load (module.js:445:3)
at Module.require (module.js:504:17)
at require (internal/module.js:20:19)
at Object. (/usr/lib/node_modules/zero/bin/zero:2:36)

If my file structure like this:

- components
-- some-component.js
- src
-- index.js

And I import ../components/some-component.js component in index.js it will fail after i run zero src

Why I want todo like so? I just don't want that zero build an route like components and thous components would be available only frontend.

Using zero for basically 100% server side rendering it would be great if I could stop the bundled JS from being included on the page as it dramatically increases page weight for zero benefit.

idea for a zero-config approach for this:

import {NoBundle} from "zero";

<NoBundle/>

// normal JSX/MDX/etc code goes here

Thoughts?

Do you support React Hooks yet? I copied and pasted the example code from the React website, however I was hit with an error:

Invariant Violation: Hooks can only be called inside the body of a function component. (https://fb.me/react-invalid-hook-call)

at /private/var/folders/k0/fqr3001s20n5gmnh5tt7jsxm0000gn/T/zeroservertmp/31fdc6488b585a0e4ab331793601476d705eb1ae/hook.jsx(Example):5
1   import React, { useState } from 'react';
2
3   function Example() {
4     // Declare a new state variable, which we'll call "count"
5     const [count, setCount] = useState(0);
6
7     return (
8       <div>
9         <p>You clicked {count} times</p>
10        <button onClick={() => setCount(count + 1)}>

hey, it would be awesome if we could write a scss / stylus files standalone.
my proposal is to be able to write a file like this:

./mystyle.styl

html
    background red

and get this back from zero:
localhost:3000/mystyle.css

html {
  background: #f00;
}

localhost:3000/mystyle.min.css

html{background:red}

Hey,

Is there currently a way to pull from private repos?
We have a dependency on a repo that is private however from looking over the docs I can't see annything regarding how we would handle this.

Cheers,

Jason

Hey there.

It will be so nice to add zero to js.org domains, https://github.com/js-org/js.org that makes it more accessible to me, can you have a look?

Thanks!

I came across this project from my github discover and found the languages stats saying it is a Python project. However it isn't. The large portion of Python is caused by the get-pip.py, a 1.62 MiB file. But from my simple searching it isn't used anywhere.

I suggest to remove this file since it can be easily downloaded from internet.

I was wondering how to go on about automating this.

Also, this project looks really good. Do you guys have a slack or spectrum community?

Next to the name of the project can you add the url - https://zeroserver.io/
Thanks

Just like react's jsx files, it would be nice to render .vue files for those who prefer Vue over React.

I use ViewModel for React, which is a library that relies on a custom Babel file to compile down to React code. This allows for a simpler declarative syntax and very useful utilities with React.

I wanted to know if zero supports the use of a .babelrc file which look like so:
{ "presets": ["es2015", "react"], "plugins": [ "viewmodel-react-plugin" ] }

Follow up to #3

The fix right now will not work on windows, and while it's better, it still has flaws. It also, oddly, imports path twice. Which is a minor thing but a trivial optimization fix.

A better, and more bulletproof, solution is to resolve the app starting directory and the requested resource and see if the app directory is part of the resource requested.

For example:

const requestedPath = path.resolve(file);
const isSafePath = requestedPath.startsWith(process.env.BUILDPATH);

This way you will always have a file that starts with the build path.

Either way - the current version is better, but not a fix.

It would be good if we can deploy this framework to now.sh. Will make it easy for serverless deployments. I think it should be a bit like nextjs.

This is such a neat idea! I LOVE the simplicity of the 'ol "let's just build a Web page by making a new file and putting code in it" thing. But something I'd really love? SSL support, so I can just deploy this baby without even throwing it behind NGINX and fiddling with let's encrypt. Is that a possibility?

useful for libs/components/views... which no need expose

From the docs (https://github.com/remoteinterview/zero/tree/master/docs/mdx), I don't see a way to integrate MDXProvider for customizing the output.

Does this functionality exist yet, or how would you see this working in the future?

I have tests set up for most of basic scenarios. It would be great if someone could set up headless chrome (puppeteer maybe) and test HMR, Parcel generated builds, file watcher, npm installation, etc.

How to serve JS file meant for browser context only?

It would be nice to work with pug files instead of HTML to get faster started with content.

<pugjs.org>

If I tipe zero something-stupid it stuck:

$ zero dflgkjndfsglkjnf
⚡️ Zero v1.0.11
✺ Updating packagesnpm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 374 packages from 213 contributors and audited 3231 packages in 7.666s
found 0 vulnerabilities

✸ Generating manifest

Sys info:

node: v10.13.0
npm: 6.4.1
Kernel Version: 4.20.10-200.fc29.x86_64
Operating System: Fedora 29 (Workstation Edition)
OSType: linux
Architecture: x86_64
CPUs: 8
Total Memory: 15.55GiB

I wonder how easy it will be to add TypeScript support. I think we only need to configure Parcel and babel.config to add support.

Also will need to make changes to all the places that make a decision based on file extension. Like here.

Couldn't find a way to force zero to use yarn to install packages

test.md containing <img src="toto.png">

yields:

  20 |              components={components}>
  21 | <img src="toto.png">
> 22 |            </MDXTag>
     |                    ^
  23 |   }
  24 | }
  25 | MDXContent.isMDXComponent = true
✺ Updating packages(node:23129) UnhandledPromiseRejectionWarning: SyntaxError: Unterminated JSX contents (19:20)

fixed with

<img src="toto.png" />

but markdown is more tolerant usually :)

I love this project, I'll be contributing as much as I can!

Since we do not have a node_modules how could we support a local instance of ESLint? (https://eslint.org/docs/user-guide/getting-started). And a .eslintrc config file.

For example:

.eslintrc.js

module.exports = {
  extends: "airbnb",
};

BTW, similar to Prettier, this can be done on the Editor side (https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint for example).

Would you guys be interested in supporting a Docker image that comes pre-built with node/zero installed?

Should be straightforward to pull in a Node image and run zero

Setup:
I created a .ts file with the "time" example from the docs utilizing moment.
I then run zero

Expected:
VSCode should be able to peek and see that moment was installed

Actual:
moment has a red squiggle with "cannot find moment..." error message

There is a UnhandledPromiseRejectionWarning occurring within the logs when running a simple getting started project. The error is unexpected, and seems to not have an effect on viewing the markdown or time endpoint (it doesn't break the frontend). It also doesn't terminate the server.

To reproduce, run a zero server with the time.js and index.md files in the gist.

Zero version: [email protected]

Full sample zero project found here, along with console log of the error: https://gist.github.com/gwpantazes/bf2a44e0541f29c4946c311ed8b8ca37

(node:1198) UnhandledPromiseRejectionWarning: TypeError [ERR_INVALID_ARG_TYPE]: The "data" argument must be one of type string, Buffer, TypedArray, or DataView. Received type object
    at Hash.update (internal/crypto/hash.js:64:11)
    at getLambdaID (/usr/local/lib/node_modules/zero/lib/router/index.js:32:47)
    at filesUpdated.forEach (/usr/local/lib/node_modules/zero/lib/router/index.js:233:24)
    at Array.forEach (<anonymous>)
    at /usr/local/lib/node_modules/zero/lib/router/index.js:229:20
    at build (/usr/local/lib/node_modules/zero/lib/index.js:52:7)
    at Timeout.setTimeout [as _onTimeout] (/usr/local/lib/node_modules/zero/lib/builder/index.js:76:7)
(node:1198) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:1198) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

If I try to build app and for some reason it fails, the script does not end here. Should exit with some fail code

[1/3] Building /app
[2/3] Building /components/counter/simple-counter
[3/3] Building 
🚨  /tmp/zeroservertmp/f27fede2220bcd326aee3e86ddfd4ebd0fe58cb9/node_modules/@webcomponents/shadycss/scoping-shim.min.js: Cannot read property 'line' of null
    at SourceMap.originalPositionFor (/home/***/node_modules/parcel-bundler/src/SourceMap.js:309:30)
    at extension.eachMapping.mapping (/home/***/node_modules/parcel-bundler/src/SourceMap.js:153:38)
    at Array.forEach (<anonymous>)
    at SourceMap.eachMapping (/home/***/node_modules/parcel-bundler/src/SourceMap.js:120:19)
    at SourceMap.extendSourceMap (/home/***/node_modules/parcel-bundler/src/SourceMap.js:152:15)
    at module.exports (/home/***/node_modules/parcel-bundler/src/transforms/terser.js:54:47)
(node:26874) UnhandledPromiseRejectionWarning: #<Object>
(node:26874) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 25)
(node:26874) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

I’m trying semiotic examples directly as .jsx files, and get this error:

 TypeError
Cannot read property 'meta' of undefined

the error apparently comes from

To reproduce go to https://semiotic.nteract.io/guides/line-chart, click on "copy full code" and paste as semiotic-example.jsx file in the zero folder.

(Is this an issue with zero or with semiotic?)

thank you

Hi there,

I am trying to include a React component library called @bandwidth/shared-components It's on npmjs here: https://www.npmjs.com/package/@bandwidth/shared-components but when I include it in a .jsx file I get the following stack trace while zero tries to resolve dependencies:

✷ Updating packages(node:5410) UnhandledPromiseRejectionWarning: Error: Invalid package name "@bandwidth": name can only contain URL-friendly characters
    at invalidPackageName (/usr/local/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:82:15)
    at Result.setName (/usr/local/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:118:11)
    at new Result (/usr/local/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:107:23)
    at Function.resolve (/usr/local/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:54:15)
    at Object.keys.map (/usr/local/lib/node_modules/npm/lib/install/deps.js:466:20)
    at Array.map (<anonymous>)
    at BB.resolve.then (/usr/local/lib/node_modules/npm/lib/install/deps.js:465:47)
    at tryCatcher (/usr/local/lib/node_modules/npm/node_modules/bluebird/js/release/util.js:16:23)
    at Promise._settlePromiseFromHandler (/usr/local/lib/node_modules/npm/node_modules/bluebird/js/release/promise.js:512:31)

I'm guessing this is a wider-spread issue affecting more than just this library. I'm not sure if it's the @ or the / that's breaking it right now.

I've poked around the zero source a little bit and could't find the error message that gets printed so I'm guessing it's coming from a library? What library would that be that is doing dependency management (or detection)?

Check components/counter/simple-counter.js file. It should output to console the css object. Works with parcel and does not works with zero

Zero v1.0.12-alpha.3
zero-bug.zip

I have current files structure

+--- api
|        +--- v1 
|        |        +--- user.js (require db and redis-connector)
|        |        +--- classroom.js (require db and redis-connector)
+--- firs_load
|        +--- db-connector.js
|        +--- redis-connector.js

How do I make zero to load these files from first_load first instead of require them in each file from v1?

Assume that I have these middlewares like this

var logStuff = [logOriginalUrl, logMethod]
app.get('/user/:id', logStuff, function (req, res, next) {
  res.send('User Info')
})

How do I write it the same way in zero?

Thank you

Add Access-Control header for CORS
currently if I request an endpoint done with zero I got
Access-Control-Allow-Origin error

This may be related to #26, and #27, but neither the regular or webpack imports work within zero server.

Does anyone have an alternative way to import PDFs and manipulate them that is compatible?

.

Is there any way to show a custom error page if the user entered a wrong url?

I have a very simple example of trying to serve an html file that looks like :

<html lang="en">
<body>
<script type="module" src="/meow.mjs"> </script>
 Hellow world
</body>
</html>

and meow.mjs reads

alert("boom")

Zero - as expected tries to bundle the js. Is there anyway we can avoid that behavior and , for some files or directories, just serve statically?

I followed parcel documentation https://parceljs.org/css.html#postcss and it worked ok, but with zero it does not works.
demo.zip

Firstly, thanks for making a great, simple server! I'm really enjoying using Zero.

I'm hosting my React app on Heroku and hoping to store some API tokens in their config vars. The Zero documentation recommends that I use a .env file, which works fine locally but I wouldn't want to deploy it my server.

Is there a recommended way to access the config vars on the front end? It seems like I should be able to extend setupEnvVariables() if you'll accept a PR.

Hi,

Currently I'm trying to use arrow function inside a react component, and got error during build:

 Support for the experimental syntax 'classProperties' isn't currently enabled

Is there anyway to support babel plugin such as "@babel/plugin-proposal-class-properties" so that classProperties can be used?

As stated, so if I have api.js:

module.exports = (req, res) => { res.send({ text: "Place your Node.js API here." }) }

then change the text to : "Bla bla", the response of /api is still "Place your Node.js API here.". I need to restart the server, is there anyway it can be hotreloaded too? thanks