Currently I had the webpack config using babel 5 due to its simplicity, but users should be able to use babel 6 and it's configuration tools, like having a babelrc file.

I am trying to build a react-pwa app for personal use ,but enclave is not installing due to a BUILD error on microsoft windows

gyp info spawn args ]
Building the projects in this solution one at a time. To enable parallel build, please add the "/m" switch.
Build started 15/04/2020 09:40:22.
MSBUILD : error MSB4132: The tools version "2.0" is unrecognized. Available tools versions are "4.0".

Build FAILED.

  MSBUILD : error MSB4132: The tools version "2.0" is unrecognized. Available tools versions are "4.0".

    0 Warning(s)
    1 Error(s)

Time Elapsed 00:00:00.27
gyp ERR! build error
gyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1```
WHAT CAN I DO?

Right now Enclave is essentially highjacking the users control of webpack and babel in exchange for simplicity. That's the point.

But we don't necessarily want to eliminate all configuration.

I'd like to extend the basic configuration of webpack loaders and babel presets / plugins into the generation of the enclave.js file via the postinstall script.

This won't add any additional prompts to the user on install, but will export arrays of loaders, presets, and plugins. It will default to the loaders and plugins we're currently using, and any the user adds will be installed and added into the appropriate files.

Looks something like this:

/* enclave.js */
// ...
exports.loaders = ['json', 'url']
exports.presets = ['es2015', 'react']
// ...

If the user adds loaders or presets they will be integrated into enclave after they re run the npm start script.

Highjacking APIs is kind of a sensitive subject, because it makes it impossible for the user to reference the API docs of babel and webpack for help, which means enclave bears the brunt of it. But I think for now that's okay.

I believe this is actually an issue with pre-commit itself. Every time I mae a commit, it is running even though it is only an enclave dependency.

I raise this here as a proposal to remove pre-commit. I've tried it on several other projects myself and it has only led to issues and removal. This is just another issue.

There are other projects like git-hooks that do the same thing that may have fewer bugs like this. Also, you can always write the hooks yourself instead of using a package. Just food for thought.

Any plan on this?

Webpack suggests using a proxy to handle requests between a node server with a REST API, db connection etc. and a hmr/live reload server. That can be complicated to set up but imho it's even more difficult to work with and deploy from. Browserify hmr does work under its covers to allow a node server to serve an html file with a hot reloadable bundle. Since the node server is serving the file and no express server is involved no proxy is required. You can just point your browser to the endpoint of the file you want hot reloaded and it works. I prefer Webpack over browserify but I think this feature is important. I'm not sure whether it would be possible with Webpack but I'm willing to look into it if you'd consider a PR for this feature.

It's really hard to tell how to run this when developing new features. I honestly have little to no idea and one other contributor had to accentuate an uncertainty because (from what i think) there's a lack of knowledge of how to test our features in development. How do you go about it @eanplatter ? It would help us all 👍

I think this guy's auto dep install is kind of neat, might be an interesting feature to think about.

EDIT: forgot the link :P
https://github.com/insin/nwb#auto-installing-npm-dependencies

I'm trying to import some .otf fonts in my sass files and it gives me this error:

ERROR in ../css-loader!../sass-loader!/Users/tonynguyen/Desktop/codetony/src/styles/main.scss
Module not found: Error: Cannot resolve 'file' or 'directory' ../../assets/fonts/BebasNeue.otf in /Users/tonynguyen/Desktop/codetony/src/styles
@ ../css-loader!../sass-loader!/Users/tonynguyen/Desktop/codetony/src/styles/main.scss 6:19924-19967

I'm sure it's the correct path. however may I ask if we have this in the loader to support different types of font files?

Whenever the reloader refreshes the page on a route other than index, I get an express route not found error.

This could be potentially solved by a catch all route that just serves the index?

First off, I'm not trolling. I think that we can all agree that getting webpack up and running with transpilation (which is needed if you use jsx and react) is a pain and that there's a learning curve. However I fail to see much of a difference between how this project can be of a benefit when we have yeoman generators. For example, this generator will get you up and running with react and webpack and hot reloading AND includes component generation if that strikes your fancy.

Again, I'm not trying to troll, I'd just like to hear @eanplatter 's vision on where he wants to go with this project.

cc @mcMickJuice

Currently enclave installs React and ReactDOM as dependencies of itself. This is an issue because enclave doesn't use these dependencies, the user does.

This also breaks enclave on certain environments because there is no React dependency in your package.json when you make a new enclave project.

What should happen instead is the postinstall script in enclave should insert the React and ReactDOM as dependencies in the user's package.json.

Currently if you make a new enclave project your deps look like this:

  "dependencies": {
    "enclave": "^0.8.8"
  }

It should be:

  "dependencies": {
    "enclave": "^0.8.8",
    "react": "^0.14.7",
    "react-dom": "^0.14.7"
  }

We could insert those dependencies the same way we do it with inserting the start script, but that could pose a lot of problems, like if people already have installed react.

What I would do is just in the postinstall run $ npm i -S react react-dom so that the user has those deps, I would also remove them as deps to enclave.

When cloning a project that uses enclave and running npm i, enclave runs all of it's prompts again and hoses the existing enclave.js.

I think it is running it's ropes post install but not checking if the project is already configured with enclave. If the project already has an enclave.js, enclave should probably not do anything on install.

Issue

Debugging is a pain right now:

Fix

If sourcemaps are turned on, we'll get pre-bundled stack traces and source code to debug. This is done with the top level devtool key in webpack config:

{
  devtool: 'cheap-module-eval-source-map',
}

The suggestion here gives the fastest rebuilds (++ on the chart) that also shows original source. This is also the default for the next major version of Webpack.

I get these errors when I run npm start:

Module build failed: Error: Couldn't find preset "es2015" relative to directory "/my-app/src"
...
/bin/sh: webpack-dev-server: command not found

Apologies if this is related to one of the other issues.

How are you going about version scheming for enclave?

I think it's deprecated, but then again I'm not sure what replaced it D:

How would one enable stage 0 features?

I'm not saying it should be enabled by default, but an easy way to enable it (if it doesn't already exist) would be nice.

Currently nothing is tested YOLO!

Apps using a router need the 404 to fallback to the index.html so the JS router can handle the route. Currently, the dev server serves a literal error page.

Webpack dev server has a config for this called historyApiFallback. It should be set to true.

How would you do this? Since it's dir down from src I can't include from index.html.

Currently omitted.

Currently it's not handling JSON files at all.

Running npm run enclave-build produces this output and never finishes. I did minimal debugging but couldn't find the issue yet.

› npm run enclave-build 

> [email protected] enclave-build /Users/levithomason/src/arena
> node node_modules/enclave/src/build.js

Here is my version info:

› npm -v
3.8.2

› node -v
v5.9.0

› cat node_modules/enclave/package.json| json version
0.10.3

› uname -mrs
Darwin 14.5.0 x86_64

Running npm run enclave-build results in a minified dev version of react being included in index_bundle.js throwing this error

index_bundle.js:1 Warning: It looks like you're using a minified copy of the development build of React. When deploying React apps to production, make sure to use the production build which skips development warnings and is faster. See https://fb.me/react-minification for more details.

Expected behavior: the included webpack build config sets the node env to production resulting in a minified production build being included in index_bundle.js

Per discussion here: #17

Following your examples and running npm start, I'm getting the errors below. Should react and react-dom be installed as peer dependencies instead of a dependency of enclave?

Error: Cannot resolve module 'react/lib/ReactMount' in M:\Dev\examples\enclave-demo\src

Error: Cannot resolve module 'react' in M:\Dev\examples\enclave-demo\src

Error: Cannot resolve module 'react-dom' in M:\Dev\examples\enclave-demo\src

enclave.js

exports.entry = "./src/Main.js"
exports.output = "dist"
exports.port = 8080
exports.index = "./src/index.html"
exports.live = false

Main.js

import React from 'react';
import { render } from 'react-dom';

class App extends React.Component {
    render() {
        return (
            <div>
                <h1>
                    Welcome to my app!
                </h1>
            </div>
        );
    }
}

render(<App />, document.getElementById('root'));

Preferably Eslint.

I was pretty surprised by the paths enclave decided to place the application files. Why not in the current directory?

var clientFiles = {
  package: '../../package.json',
  config: '../../enclave.js'
}

The comment says These are the paths for files that live in the user's application root. it actually installed the files two folders above my application root.

Hey, I messed up the regex. I forgot the ending /. Could you fix that so I don't have to create another pr? Thanks