Set initial opened file, skip deps install & do not run start scripts as options in sandbox.config.json

[jthegedus]

Is there a way that the settings inference could be done without the main field in the package.json. This requirement is blocking me, as specifying a main field will conflict with other tools I use, messing up their configuration (firebase/firebase-tools#662).

With an empty main field my other tooling works as expected, but then I receive this error:

An error occured when fetching the sandbox:
Cannot find the specified entry point: 'src/index.js'. Please specify one in 'package.json#main' or create a file at the specified entry point.

Since other templates require specific dependencies, could it check if those templates apply first, then upon failing, infer that the repo being cloned is just an arbitrary folder structure?

As discussed here #43 and https://codeburst.io/github-medium-with-embedly-30d9115af585, I don't wish to execute the code from the repo in CodeSandbox, but merely use it as a way to keep blog code snippets in sync across my Medium blog (using gists for snippets in Medium is unmanagable).

Feat requests resolved

• open specific file (specified in url)
• do not automatically install package.json deps
• do not automatically run scripts in package.json
• do not require main field in package.json as it conflicts with other tools

[CompuIves]

Hmm, interesting. We have a list of entry points we traverse specific per template. The package.json entry is the first one we try. Do you have a link to the sandbox? I could definitely add an override based on sandbox.config.json!

[jthegedus]

An override would be great!

This sandbox loads fine as I've got an empty file src/index.js and a main field: https://codesandbox.io/s/github/jthegedus/blog-examples/tree/master/firebase-functions-express . But this breaks the Firebase deployment as it concatenates the main field to the deployment dir. An issue I have raised with Firebase firebase/firebase-tools#662 . This is the repo - https://github.com/jthegedus/blog-examples/tree/master/firebase-functions-express .

I have noticed that it recognises this as the create-react-app template, which I assume is the template inferred by the src/index.js file.

This sandbox fails to load as there is no main field in the package.json: https://codesandbox.io/s/github/jthegedus/blog-examples/tree/master/firebase-functions-es6-babel . This is the repo structure I have which deploys to Firebase fine because the main field is empty and so does not concatenate anything to the other deploy dir definitions in the firebase.json - https://github.com/jthegedus/blog-examples/tree/master/firebase-functions-es6-babel

Sorry I can't be of more help and PR a fix myself. You've innovated so much it's beyond me where to even start a solution.

[CompuIves]

Okay!

So if I understand correctly, you want to show https://github.com/jthegedus/blog-examples/blob/master/firebase-functions-es6-babel/src/functions/index.js from the https://github.com/jthegedus/blog-examples/blob/master/firebase-functions-es6-babel repo, without setting main in package.json, right?

[jthegedus]

That's correct.

I want to add the project to CodeSandbox without the main field being used to determine anything about the project structure. I want the folder I link on GitHub Import to be the root that CodeSandbox loads, and that's it. If main is populated, a config option to opt-out of using it to determine the project structure would mean I could use main as required by other tools.

I understand that it is common practice to use main to determine the entry point of the app, but the repo structure I have is a stripped down monorepo, without a single entry point.

The discussion here firebase/firebase-tools#662 covers how the firebase-tools CLI tool requires main for deployment. Because each tool uses main and they each require a different path/file to work they conflict.

[ameriania]

I am encountering the same problem.

In my cases,i just want to clone a repo to show in CodeSandBox,and have some editting,that's it.

But it seems not support yet.

[ryanpcmcquen]

It would be great if CodeSandbox scanned the package.json for a codesandbox property, is this possible? Conversely, if the sandbox.config.json allowed the specification of an entry point that would also work.

[Saeris]

Spent a good chunk of time trying to hunt down where exactly in the code CSB is reading the package.json file to get the main path and to see if I could add an override into sandbox.config.json. Couldn't find it. That code is all over the place.

I'm commenting to add another use case for having such an override. I'm trying to write a component library and I need to use the main field in package.json for NPM. Since I developed both the component library and it's demo page in CSB, I was really hoping I could support users simply importing the repo to get a live demo, but as it stands it's one or the other. The only other alternative I see is having some sort of mono-repo structure with multiple package.json files, one for the library and one for the demo page. Maybe I'd need to do that anyways since CSB doesn't seem to install all of the devDependencies either. It would be good to see an example for this use case though, as I'm sure there's a large audience of library developers who would like to use CSB to demo their code.

[eps1lon]

@Saeris mui-org/material-ui uses a dedicated examples directory which includes multiple examples that can be used for codesandbox like so: https://codesandbox.io/s/github/mui-org/material-ui/tree/master/examples/create-react-app

I think this approach better suited for your use case.

[CompuIves]

Oh I'm sorry for that @Saeris, the code to support the sandbox.config.js can be found here: https://github.com/CompuIves/codesandbox-client/blob/private-github/packages/common/templates/template.js#L74-L83

[jthegedus]

The material-ui method is not quite the same as it is using a pre-existing template. It somehow infers that I am using the create-react-app template 🤷‍♂️ but the fact that I can create a sandbox with my repo allows me to use Codesandbox for rendering my code snippets. I am not sure what changed over the past 5 months that now lets this work.

What would be ideal is if sandbox.config.json had a flag to completely turn off the compilation. I just want to render code snippets in my blog, but can't do so without stopping people trying to build a project I know cannot be run within Codesandbox. And by turning off the compilation I guess would make the rest of the issues I am having moot.

For reference, this is the example I wanted: https://codesandbox.io/s/github/jthegedus/firebase-gcp-examples/tree/master/firebase-functions-es6-babel

[lbogdan]

Also related: #1254 (that was however solved by adding the Aurelia template).