preactjs / preact-cli Goto Github PK

View Code? Open in Web Editor NEW

4.7K 70.0 376.0 8.56 MB

😺 Your next Preact PWA starts in 30 seconds.

License: MIT License

JavaScript 97.67% CSS 0.43% SCSS 0.04% EJS 1.78% Shell 0.05% Sass 0.03%

preact cli prpl http2 pwa starter-kit hacktoberfest

preact-cli's People

Contributors

Stargazers

Watchers

Forkers

xtuc scottmas marvinhagemeister rkostrzewski easymax1069 barbagrigia maoberlehner addyosmani empia reyadrahman jacobmarshall-etc mitakeck lnked praveenjuge david-potgieter billel-boudchicha fivetanley jechtliu niko150 bhavikbhavsar puppycodes hhy5277 storagebot krawaller othmaan robdodson kiricon ashes74 ankeetmaini hjiayz auchenberg oren thangngoc89 benoitzugmeyer parksangkil tarekdj hassanbazzi zhlella panricas lwakefield fforres whjvenyl carable barkinet diagramatics compuives xuanyanghou dignifiedquire speier ethanroday xyyjk bdsabian flea89 minhchu saravieira framp jgw96 gokulkrishh knight-bubble andrevargas kadobot malbernaz ekanna derickwarshaw cwonrails aritheelk rbscott jakeheadley paweljedrzejczyk briangonzalez louisremi threehams jbelis shadowkun anantoghosh augmen maximeborges emsifa cuduy197 sgangadhar02 eligao maxushuang ryandegruyter alvarezc laggingreflex davepuchyr zouhir joshuataylor jskorepa jmfirth nateradebaugh hungnguyenthai xfumihiro kdncode mrrichmine elevenpassin shivamgupta211 ralphsmith80 jnaftali lukeed

preact-cli's Issues

sw-cache not working (for offline use)

Is it intentional that sw cache doesn't work out of the box?

I did preact create my-great-app, build the project using npm run build and serve build/ using php simple server.

I visit my localhost, the site is up, I can see the code to register service worker in /bundle.js but the registration code wasn't executed. However, it works if i manually register it again, i.e. by executing navigator.serviceWorker.register('/sw.js', { scope: '/' }); in browser console.

I'm using Opera 45 in OSX.

'npm run serve' shows TLS error and the site is not running

npm run serve show me TLS error in the terminal and going to http://localhost:8080/ on chrome tells me "site can't be reached"

Steps to reproduce:

preact create app --type full
cd app
npm run serve

Output:

> [email protected] serve /tmp/app
> preact build && preact serve

Build [==================  ] 91% (2.5s) additional asset processing
  Total precache size is about 173 kB for 15 resources.

  Listening on https://localhost:8080...
  http: TLS handshake error from [::1]:46434: read tcp [::1]:8080->[::1]:46434: use of closed network connection
  http: TLS handshake error from [::1]:46436: read tcp [::1]:8080->[::1]:46436: use of closed network connection
  http: TLS handshake error from [::1]:46440: read tcp [::1]:8080->[::1]:46440: use of closed network connection
  http: TLS handshake error from [::1]:46552: read tcp [::1]:8080->[::1]:46552: use of closed network connection

More info:

Ubuntu 16.04
npm 5.0.0
node 7.7.4

Prerender fails when using React component

This is yet another SSR bug :D

Reproduce:

Include any 3rd party component and run build with prerender
Error message:

Template execution failed: Error: Cannot find module 'react'
  Error: Cannot find module 'react'
  
  - prerender.js:43 Function.Module._resolveFilename
    [frontend]/[preact-cli]/lib/lib/prerender.js:43:21
  
  - module.js:20 require
    internal/module.js:20:19
  
  - index.jsx:1 Object.<anonymous>
    /home/khoa/web/tooth/frontend/components/Search/index.jsx:1:1
  
  - node.js:144 loader
    [frontend]/[babel-register]/lib/node.js:144:5
  
  - node.js:154 Object.require.extensions.(anonymous function) [as .jsx]
    [frontend]/[babel-register]/lib/node.js:154:7
  
  - module.js:20 require
    internal/module.js:20:19
  
  - index.js:7 Object.<anonymous>
    /home/khoa/web/tooth/frontend/index.js:7:1
  
  - node.js:144 loader
    [frontend]/[babel-register]/lib/node.js:144:5
  
  - node.js:154 Object.require.extensions.(anonymous function) [as .js]
    [frontend]/[babel-register]/lib/node.js:154:7

'Empty cache and hard reload' in Chrome crashes demo site

https://cli-demo.preactjs.com/profile/john
I don't know if this is an issue/bug I am curious why it happens (I know think it is a bug because if I just opens this link in private mode it crashes):
(in Chrome, have the developer tools open and then right click on the reload button)

Error when require a PNG image

This only happens on build step, it doesn't happen on dev mode. I guests it's node/webpack environment

Stack trace:

Template execution failed: SyntaxError: /home/khoa/web/tooth/frontend/components/search/trans.png: Unexpected character '�' (1:0)
  SyntaxError: /home/khoa/web/tooth/frontend/components/search/trans.png: Unexpected character   '�' (1:0)
  > 1 | �PNG
      | ^
    2 | ?
    3 | [22m
    4 | IHDR  m[41  1mQ�^a[22m  2mtEXtSoftwareAdobe ImageReadyq�e  m<  qiTXtXML:com.adobe.xmp  <?xpacket begin=" " id="W5M0MpCehiHzreSzNTczkc9d"?> <x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk  3m="Adobe XMP Core 5.5-c014 79.151481, 2013/03/13-12:09:15        ">  m <rdf:RDF xmlns:rdf="http:  //www.w3.org/1999/02/22-rdf-syntax-ns#"> <rdf:[33mDescription rdf:about="" xmlns:xmpMM=[39m"http://ns.adobe.com/xap/1.0/mm/" xmlns:stRef="http:/  /ns.adobe.com/xap/1.0/sType/ResourceRef#" xmlns:xmp="http://ns  .adobe.com/xap/1.0/" xmpMM:OriginalDocumentID="xmp.d  id:d3a7c906-7b1b-1749-be6c-7b7c0df0881c" xmpMM:DocumentID=  m"xmp.did:FC0A9B24DE7111E4A312C636C492E7C2" xmpMM:InstanceID="xmp.iid:FC0A9B23DE7111E4A312C636C492E7C2" xmp:CreatorTool  ="Adobe Photoshop CC (Windows)"> <xmpMM  9m:DerivedFrom stRef:instanceID="xmp.iid:f76eb8  cd-94ec-114f-a62f-7f548c5ac408" stRef:documentID="xmp.did:d3a7  c906-7b1b-1749-be6c-7b7c0df0881c"/> </rdf[39m:Description> </rdf:  9mRDF> </x:xmpmeta> <?xpacket end="r"?>t`��ID  ATxڼ��
  
  - index.js:4452 Parser.pp$5.raise
    [frontend]/[babylon]/lib/index.js:4452:13
  
  - index.js:1147 Parser.getTokenFromCode
    [frontend]/[babylon]/lib/index.js:1147:10
  
  - index.js:776 Parser.readToken
    [frontend]/[babylon]/lib/index.js:776:19
  
  - index.js:7148 Parser.readToken
    [frontend]/[babylon]/lib/index.js:7148:20
  
  - index.js:766 Parser.nextToken
    [frontend]/[babylon]/lib/index.js:766:19
  
  - index.js:1672 Parser.parse
    [frontend]/[babylon]/lib/index.js:1672:10
  
  - index.js:7180 parse
    [frontend]/[babylon]/lib/index.js:7180:37
  
  - index.js:517 File.parse
    [frontend]/[babel-core]/lib/transformation/file/index.js:517:15
  
  - index.js:602 File.parseCode
    [frontend]/[babel-core]/lib/transformation/file/index.js:602:20
  
  - pipeline.js:49 
    [frontend]/[babel-core]/lib/transformation/pipeline.js:49:12
  
  - index.js:564 File.wrap
    [frontend]/[babel-core]/lib/transformation/file/index.js:564:16
  
  - pipeline.js:47 Pipeline.transform
    [frontend]/[babel-core]/lib/transformation/pipeline.js:47:17
  
  - node.js:152 Object.transformFileSync
    [frontend]/[babel-core]/lib/api/node.js:152:10
  
  - node.js:118 compile
    [frontend]/[babel-register]/lib/node.js:118:20
  
  - node.js:144 loader
    [frontend]/[babel-register]/lib/node.js:144:14
  
  - node.js:154 Object.require.extensions.(anonymous function) [as .js]
    [frontend]/[babel-register]/lib/node.js:154:7
  
  - module.js:20 require
    internal/module.js:20:19
  
  - index.js:4 Object.<anonymous>
    /home/khoa/web/tooth/frontend/components/search/index.js:4:1

Support async/await by default?

Hi,
is preact-cli support async await function?

thanks

What is the purpose of `preact serve`

The docs say: Start an HTTP2 static fileserver. When do I need to run it?
When I run it I see the following

Listening on https://localhost:8080...
  http: TLS handshake error from [::1]:50858: read tcp [::1]:8080->[::1]:50858: use of closed network connection

Service worker on localhost

@lukeed @developit this is in reference to #30 bug. we are deliberately stopping `sw` from non secure `localhost`. It might be worth looking into whether or not we want this to continue.

I tried running a new app with npm run serve but i my browsers does not identify the certificate, hence blocking the sw from getting active.

How to run the projects in the example folder?

I tried each one of the following but nothing worked:

npm start
preact watch
preact serve
python -m SimpleHTTPServer

Can't use async functions and generators

I've found that regeneratorRuntime is disabled.

I'm trying to run react-coroutine in the setup of preact and preact-cli but I'm not able to use async functions. Am I missing some point of the configuration or it is not yet implemented? Thank you in advance.

Navigation link not highligthed when active URL

I'm really new to (p)react, and one of the first thing I noticed is that the Link to the active page is not highligthed as it should be seeing the code. I tried to investigate and I found out that the css classes generated for the client is suffixed with the hash of the current file to isolate class. The problem is that not only the 'root' class imported is suffixed, but the '.active' from '.header nav a.active' is also suffixed and that the activeClassName only append 'active' and not 'active__xxxxx' to the html tag.
CSS wanted to be applied:

.header nav a.active {
	background: rgba(255,255,255,0.4);
}

CSS generated for the client:

.header__3QGkI nav a.active__3gItZ {
	background: rgba(255,255,255,0.4);
}

Sample of jsx for the Link:
<Link activeClassName="active" href="/">Home</Link>
Generated HTML on an active page:
<a href="/" class="active">Home</a>

Webpack error on .scss when using `preact build`

So, I tried to add SASS support - like others I needed to npm install sass-loader node-sass postcss -D - I also needed to update the import to import './style/index.scss'

Now, when I npm run build everything seems to generate just fine except the index.html page - it contains the same error as the console, which is...

Template execution failed: SyntaxError: /preact-app/style/index.scss: Unexpected token, expected ; (1:11)
  SyntaxError: /preact-app/style/index.scss: Unexpected token, expected ; (1:11)
  > 1 | html, body {
      |            ^
    2 |  height: 100%;
    3 |  width: 100%;
    4 |  padding: 0;

Googling this error brings up lots of finger pointing at Webpack in one way or another - in particular it's an issue with SSR I think is the gist of it:

webpack-contrib/sass-loader#69
webpack/webpack#1754
react-toolbox/react-toolbox#662

It would appear that the .scss module is being interpreted as .js when it is loaded for SSR and it then fails - that's about as much as I can figure out.

Supporting source-maps in development mode

Unless I did something wrong, I can tell that preact-cli doesn't provide source map for development. I'm seeing cryptic error like this:

VM2163:37 Uncaught DOMException: Failed to execute 'createElement' on 'Document': The tag name provided ('[object Object]') is not a valid name.
    at u (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:37:86)
    at m (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:70:471)
    at h (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:67:110)
    at k (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:149:113)
    at k (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:148:185)
    at x (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:128:419)
    at U (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:169:176)
    at m (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:70:349)
    at v (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:98:12)
    at m (eval at <anonymous> (http://localhost:8080/bundle.js:830:1), <anonymous>:76:228)

(nice to have) Document what each type of project mean

It might be nice to have a quick document that explains the difference between each project type.
For example - the default is using CSS but the full is using less.

Code is over 6k. Plz fix

How to use variables with different values for production?

I am switching to preact-cli from the preact boilerplate and I noticed that there is no webpack configuration file. The only missing feature for me is the ability to change the URL of my server: during development I am accessing localhost:3000 and during production api.my-server.com. With the preact boilerplate I use webpack's DefinePlugin:

new webpack.DefinePlugin({
  'process.env.NODE_ENV': JSON.stringify(ENV),
  'API_HOST': (ENV === 'production') ? JSON.stringify('https://api.my-server.com') : JSON.stringify('http://localhost:3000')
}),

(Here is the code as part of the entire project)

How do I achieve the same capability with preact-cli? I don't mind not using webpack at all. I know it can be done with grep and sed but that might not work on windows machines.

Thanks!

Flow support

Hello,
This monday morning, I'm toying with preact-cli : super enjoyable experience !
I was just wondering what's your stance on Flow type system support ?
Thanks :)

Consider using the NamedModulesPlugin for module names.

Consider using the NamedModulesPlugin for module names. This option lists names of the modules that are hot reloaded vs the ids as displayed currently:

Couldn't find preset "es2015" relative to directory

I'm getting an error with a newly created app. I'm just trying to run it after the initial install.
Navigating to localhost:8080 I get a 404.

D:\projects\pwa\preact\my-pwa-test>npm start

> [email protected] start D:\projects\pwa\preact\my-pwa-test
> if-env NODE_ENV=production && npm run -s serve || npm run -s dev

  > Development server started at http://localhost:8080
(webpack)-dev-server/client?http://0.0.0.0:8080/
Module build failed: Error: Couldn't find preset "es2015" relative to directory "D:\\projects"
    at D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:293:19
    at Array.map (native)
    at OptionManager.resolvePresets (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
    at OptionManager.mergePresets (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
    at OptionManager.mergeOptions (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
    at OptionManager.init (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
    at File.initOptions (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\index.js:212:65)
    at new File (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\index.js:135:24)
    at Pipeline.transform (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\index.js:48:20)
    at D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\fs-cache.js:118:18
    at ReadFileContext.callback (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\fs-cache.js:31:21)
    at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:359:13)
 @ multi ./~/preact-cli/lib/lib/entry webpack-dev-server/client?http://0.0.0.0:8080/ webpack/hot/dev-server?http://0.0.0.0:8080/
./~/preact-cli/lib/lib/entry.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "D:\\projects"
    at D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:293:19
    at Array.map (native)
    at OptionManager.resolvePresets (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
    at OptionManager.mergePresets (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
    at OptionManager.mergeOptions (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
    at OptionManager.init (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
    at File.initOptions (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\index.js:212:65)
    at new File (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\index.js:135:24)
    at Pipeline.transform (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\index.js:48:20)
    at D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\fs-cache.js:118:18
    at ReadFileContext.callback (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\fs-cache.js:31:21)
    at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:359:13)
 @ multi ./~/preact-cli/lib/lib/entry webpack-dev-server/client?http://0.0.0.0:8080/ webpack/hot/dev-server?http://0.0.0.0:8080/
(webpack)/hot/dev-server.js?http://0.0.0.0:8080/
Module build failed: Error: Couldn't find preset "es2015" relative to directory "D:\\projects"
    at D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:293:19
    at Array.map (native)
    at OptionManager.resolvePresets (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
    at OptionManager.mergePresets (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
    at OptionManager.mergeOptions (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
    at OptionManager.init (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
    at File.initOptions (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\index.js:212:65)
    at new File (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\file\index.js:135:24)
    at Pipeline.transform (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\index.js:48:20)
    at D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\fs-cache.js:118:18
    at ReadFileContext.callback (D:\projects\pwa\preact\my-pwa-test\node_modules\babel-loader\lib\fs-cache.js:31:21)
    at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:359:13)
 @ multi ./~/preact-cli/lib/lib/entry webpack-dev-server/client?http://0.0.0.0:8080/ webpack/hot/dev-server?http://0.0.0.0:8080/

Error while running npm install

Steps to reproduce:

preact create app --type full
cd app
rm -r node_modules
npm i

Output:

> [email protected] install /tmp/app/node_modules/fsevents
> node install


> [email protected] postinstall /tmp/app/node_modules/simplehttp2server
> node lib/install.js

  ⚠ The `/tmp/app/node_modules/simplehttp2server/vendor/simplehttp2server` binary doesn't seem to work correctly
  ⚠ simplehttp2server pre-build test failed
  ℹ compiling from source
  ✖ Error: mkdir -p /tmp/app/node_modules/simplehttp2server/vendor && sh crosscompile.sh && mv ./8116695f-a7dc-49cc-8de9-70f1346a9f2d_linux_amd64 /tmp/app/node_modules/simplehttp2server/vendor/simplehttp2server
Command failed: sh crosscompile.sh && mv ./8116695f-a7dc-49cc-8de9-70f1346a9f2d_linux_amd64 /tmp/app/node_modules/simplehttp2server/vendor/simplehttp2server
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
        /usr/local/go/src/github.com/NYTimes/gziphandler (from $GOROOT)
        /home/oren/p/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
        /usr/local/go/src/github.com/NYTimes/gziphandler (from $GOROOT)
        /home/oren/p/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
        /usr/local/go/src/github.com/NYTimes/gziphandler (from $GOROOT)
        /home/oren/p/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
        /usr/local/go/src/github.com/NYTimes/gziphandler (from $GOROOT)
        /home/oren/p/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
        /usr/local/go/src/github.com/NYTimes/gziphandler (from $GOROOT)
        /home/oren/p/go/src/github.com/NYTimes/gziphandler (from $GOPATH)

    at ChildProcess.exithandler (child_process.js:205:12)
    at emitTwo (events.js:106:13)
    at ChildProcess.emit (events.js:194:7)
    at maybeClose (internal/child_process.js:899:16)
    at Socket.<anonymous> (internal/child_process.js:342:11)
    at emitOne (events.js:96:13)
    at Socket.emit (events.js:191:7)
    at Pipe._handle.close [as _onclose] (net.js:513:12)
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

added 1199 packages in 30.238s

More info:

Ubuntu 16.04
npm 5.0.0
node 7.7.4

Consider using .less files instead of .css files for default

Nice work! It gives me shivers of happiness to see that 20kb download size for a fully functional app.

However, I just barely ran preact create my-test-app and it doesn't come with built in LESS support, just boring old .css files. Or is there a config to use LESS? Do you need to bump the NPM version? Since I see in your examples folder that LESS should be supported.

Build error with preact-material-components

Hello,

Linking a component from preact-material-components works like a charm in dev mode but when trying to build for production it fails.

Steps to reproduce

preact create test
cd test
npm install --save preact-material-components
edit routes/home/index.js
paste this code :

import { h, Component } from 'preact'
import style from './style'

import FormField from 'preact-material-components/FormField'
import Radio from 'preact-material-components/Radio'

import 'preact-material-components/FormField/style.css'
import 'preact-material-components/Radio/style.css'


export default class Home extends Component {
  render() {
    return (
      <div class={style.home}>
        <h1>Home</h1>
        <FormField>
          <Radio id="r1" name='opts'></Radio>
          <label for="r1">Radio 1</label>
          <Radio id="r2" name='opts'></Radio>
          <label for="r2">Radio 2</label>
        </FormField>
      </div>
    )
  }
}

=> npm start : OK

=> npm run build : Fails

Template execution failed: SyntaxError: Unexpected token import
  Error: /Users/cedric/Desktop/test/node_modules/preact-material-components/FormField/index.js:1
  (function (exports, require, module, __filename, __dirname) { import { h } from "preact";
                                                                ^^^^^^
  SyntaxError: Unexpected token import
  
  - node.js:152 Object.require.extensions.(anonymous function) [as .js]
    [test]/[babel-register]/lib/node.js:152:7
  
  - module.js:20 require
    internal/module.js:20:19
  
  - index.js:4 Object.<anonymous>
    /Users/cedric/Desktop/test/routes/home/index.js:4:1
  
  - node.js:144 loader
    [test]/[babel-register]/lib/node.js:144:5
  
  - node.js:154 Object.require.extensions.(anonymous function) [as .js]
    [test]/[babel-register]/lib/node.js:154:7
  
  - module.js:20 require
    internal/module.js:20:19
  
  - index.js:7 Object.<anonymous>
    /Users/cedric/Desktop/test/index.js:7:1
  
  - node.js:144 loader
    [test]/[babel-register]/lib/node.js:144:5

Any idea ?

require.ensure named-chunk from async-component-loader is unsafe for URL

This is a bug report

Describe the problem

Currently, async-component-loader names chunk with full path (something like /home/user/.../index.js)

Webpack then uses these names to emit files and then load them with relative paths.

Webpack's code to load the chunk:

var head = document.getElementsByTagName('head')[0];
/******/ 		var script = document.createElement('script');
/******/ 		script.type = 'text/javascript';
/******/ 		script.charset = 'utf-8';
/******/ 		script.async = true;
/******/ 		script.timeout = 120000;
/******/
/******/ 		if (__webpack_require__.nc) {
/******/ 			script.setAttribute("nonce", __webpack_require__.nc);
/******/ 		}
/******/ 		script.src = __webpack_require__.p + "" + ({"0":"polyfills","1":"route-home","2":"/home/khoa/web/tooth/frontend/routes/profile/index.js","3":"/home/khoa/web/tooth/frontend/components/SuggestionList/index.jsx","4":"route-profile"}[chunkId]||chunkId) + ".chunk." + {"0":"9226481e4a5e84a7ee24","1":"b5e4c77eba4ee1f85a5f","2":"30aa1718e1c2e1be2a10","3":"93378fcc5f457e450ce9","4":"df80d0c60dc51a254ff3"}[chunkId] + ".js";

The last line prettified:

script.src =
  __webpack_require__.p +
  "" +
  ({
    "0": "polyfills",
    "1": "route-home",
    "2": "/home/khoa/web/tooth/frontend/routes/profile/index.js",
    "3": "/home/khoa/web/tooth/frontend/components/SuggestionList/index.jsx",
    "4": "route-profile"
  }[chunkId] || chunkId) +
  ".chunk." +
  {
    "0": "9226481e4a5e84a7ee24",
    "1": "b5e4c77eba4ee1f85a5f",
    "2": "30aa1718e1c2e1be2a10",
    "3": "93378fcc5f457e450ce9",
    "4": "df80d0c60dc51a254ff3"
  }[chunkId] +
  ".js";

This leads to 2 problems:

Unable to async load any components (except route chunks since they are named differently)

For ex, chunkId = 3 url (in the above example) is http://home/khoa/web/tooth/frontend/components/SuggestionList/index.jsx.chunk.93378fcc5f457e450ce9.js . Which is obviously results in a 404

Privacy

Leaking path to the public isn't something I want to do.

Suggestions

I suggest to generate chunk name using a quick hash function like sha-1 with relative path of the file in the project. This chunk name is persistent regarding the build path which is important for long-term caching.

P/S: Sorry in advance if my poor English skills annoyed you.

Update:

I created a simple repo to reproduce this https://github.com/thangngoc89/preact-cli-47

Steps to repo:

npm install
npm start

(and look at the browser's console)

Blank source map for style.css

The generated style.css.map is currently blank right now

HTTPS support

Some APIs require HTTPS for them to function (such as geolocation, getUserMedia). Being able to start a server with HTTPS (with or without supplied (self signed) certs) would help testing on devices.

Edit the <head> section

Currently, I can't find a way to edit the section in generated HTML. Am I missing something?

Polluted error report

This is how the output error of a wrong import path looks like

./~/babel-loader/lib?{"cacheDirectory":true,"plugins":["/home/khoa/web/tmp/b/~/babel-plugin-transform-object-assign/lib/index.js","/home/khoa/web/tmp/b/~/babel-plugin-transform-decorators-legacy/lib/index.js","/home/khoa/web/tmp/b/~/babel-plugin-transform-react-constant-elements/lib/index.js","/home/khoa/web/tmp/b/~/babel-plugin-transform-react-remove-prop-types/lib/index.js",["/home/khoa/web/tmp/b/~/babel-plugin-transform-react-jsx/lib/index.js",{"pragma":"h"}],["/home/khoa/web/tmp/b/~/babel-plugin-jsx-pragmatic/jsx-pragmatic.js",{"module":"preact","export":"h","import":"h"}]],"presets":[["/home/khoa/web/tmp/b/~/babel-preset-env/lib/index.js",{"loose":true,"modules":false,"uglify":true,"browsers":["> 1%","Last 2 versions","IE >= 9"],"exclude":["transform-regenerator","transform-es2015-typeof-symbol"]}],"/home/khoa/web/tmp/b/~/babel-preset-stage-0/lib/index.js"]}!./routes/home/index.js
Module not found: Error: Can't resolve '../../this-component-should-be-load-async' in '/home/khoa/web/tmp/b/routes/home'
resolve '../../this-component-should-be-load-async' in '/home/khoa/web/tmp/b/routes/home'
  using description file: /home/khoa/web/tmp/b/package.json (relative path: ./routes/home)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: /home/khoa/web/tmp/b/package.json (relative path: ./routes/home)
    using description file: /home/khoa/web/tmp/b/package.json (relative path: ./this-component-should-be-load-async)
      as directory
        /home/khoa/web/tmp/b/this-component-should-be-load-async doesn't exist
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.js doesn't exist
      .jsx
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.jsx doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.ts doesn't exist
      .tsx
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.tsx doesn't exist
      .json
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.json doesn't exist
      .less
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.less doesn't exist
      .scss
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.scss doesn't exist
      .sass
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.sass doesn't exist
      .css
        Field 'browser' doesn't contain a valid alias configuration
        /home/khoa/web/tmp/b/this-component-should-be-load-async.css doesn't exist
[/home/khoa/web/tmp/b/this-component-should-be-load-async]
[/home/khoa/web/tmp/b/this-component-should-be-load-async]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.js]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.jsx]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.ts]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.tsx]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.json]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.less]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.scss]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.sass]
[/home/khoa/web/tmp/b/this-component-should-be-load-async.css]
 @ ./~/babel-loader/lib?{"cacheDirectory":true,"plugins":["/home/khoa/web/tmp/b/~/babel-plugin-transform-object-assign/lib/index.js","/home/khoa/web/tmp/b/~/babel-plugin-transform-decorators-legacy/lib/index.js","/home/khoa/web/tmp/b/~/babel-plugin-transform-react-constant-elements/lib/index.js","/home/khoa/web/tmp/b/~/babel-plugin-transform-react-remove-prop-types/lib/index.js",["/home/khoa/web/tmp/b/~/babel-plugin-transform-react-jsx/lib/index.js",{"pragma":"h"}],["/home/khoa/web/tmp/b/~/babel-plugin-jsx-pragmatic/jsx-pragmatic.js",{"module":"preact","export":"h","import":"h"}]],"presets":[["/home/khoa/web/tmp/b/~/babel-preset-env/lib/index.js",{"loose":true,"modules":false,"uglify":true,"browsers":["> 1%","Last 2 versions","IE >= 9"],"exclude":["transform-regenerator","transform-es2015-typeof-symbol"]}],"/home/khoa/web/tmp/b/~/babel-preset-stage-0/lib/index.js"]}!./routes/home/index.js 11:0-61
 @ ./routes/home/index.js
 @ ./index.js
 @ ./~/preact-cli/lib/lib/entry.js
 @ multi ./~/preact-cli/lib/lib/entry webpack-dev-server/client?http://0.0.0.0:8080/ webpack/hot/dev-server?http://0.0.0.0:8080/

The only interested part in the error is this:

Module not found: Error: Can't resolve '../../this-component-should-be-load-async' in '/home/khoa/web/tmp/b/routes/home'

Hope you can fix this.

Exception when switching routes

With a plain project I always get this exception when switching routes (clicking the nav links at the top right):

devtools.js?9943:333 Uncaught TypeError: Cannot read property '_renderedComponent' of undefined
    at visitNonCompositeChildren (eval at <anonymous> (bundle.js:1140), <anonymous>:209:16)
    at Object.componentUpdated (eval at <anonymous> (bundle.js:1140), <anonymous>:151:4)
    at Object.preact.options.afterUpdate (eval at <anonymous> (bundle.js:1140), <anonymous>:237:11)
    at k (eval at <anonymous> (bundle.js:896), <anonymous>:159:122)
    at i (eval at <anonymous> (bundle.js:896), <anonymous>:28:16)

It doesn't appear on full reload though, only when navigating.

Version bundle.js & style.css

I would call this "mild priority" right now, simply because, as is, bundle.js is the majority of the application weight//network transfer. It's set for a maximum of 1 hour, which means that users will need to redownload an entire application, regardless of any changes it may or may not have had. Plus, this kind of impedes the function of offline/sw-precache.

Also, in the rare event that my app goes from v1 to v2 within the hour that User has cached my bundle, their next request would grab all the v2 chunks & sw.js, which still points to non-versioned bundle.js, which results in User working with a mismatched set of assets... the majority of which (in bundle) is now outdated.

If we're on the same page here, we'd need to:

Version bundle.js, like everything else
Update server headers; would up it to 1YR
Replace the HTML bundle.js link per-build; handled by html-webpack-plugin

This all applies to style.css as well: same tasks & reasoning.

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because we are using your CI build statuses to figure out when to notify you about breaking changes.

Since we did not receive a CI status on the greenkeeper/initial branch, we assume that you still need to configure it.

If you have already set up a CI for this repository, you might need to check your configuration. Make sure it will run on all new branches. If you don’t want it to run on every branch, you can whitelist branches starting with greenkeeper/.

We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

Try and get `create-preact-app` package on NPM

Looks like @alexkuz owns the create-preact-app package on NPM.

It'd be amazing if he would be willing to transfer it in order to enable the new yarn create workflow.

yarn create preact-app

Custom server support

Instead of having a static production-like server when building for production. It would definitely be awesome to have some kind of "custom server" type of output like next.js has.

Encountered issues during global install

 ❯ npm i -g preact-cli
/Users/rcamara/.nvm/versions/node/v6.9.1/bin/preact -> /Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/lib/index.js

> [email protected] install /Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/fsevents
> node install

[fsevents] Success: "/Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/fsevents/lib/binding/Release/node-v48-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile

> [email protected] postinstall /Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/simplehttp2server
> node lib/install.js

  ⚠ The `/Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor/simplehttp2server` binary doesn't seem to work correctly
  ⚠ simplehttp2server pre-build test failed
  ℹ compiling from source
  ✖ Error: mkdir -p /Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor && sh crosscompile.sh && mv ./0b8e785b-983c-4e28-a5e6-2ff843386495_darwin_amd64 /Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor/simplehttp2server
Command failed: sh crosscompile.sh && mv ./0b8e785b-983c-4e28-a5e6-2ff843386495_darwin_amd64 /Users/rcamara/.nvm/versions/node/v6.9.1/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor/simplehttp2server
bash: go: command not found
bash: go: command not found
bash: go: command not found
bash: go: command not found
bash: go: command not found

    at ChildProcess.exithandler (child_process.js:206:12)
    at emitTwo (events.js:106:13)
    at ChildProcess.emit (events.js:191:7)
    at maybeClose (internal/child_process.js:877:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)

then at the very last line

npm WARN [email protected] requires a peer of preact@* but none was installed.

Make `preact serve` always use default config OR remove `preact serve`

After executing preact build and then running preact serve in the build directory, I'm always getting 404's. It works fine when I do a http server. And it even works when I use local-web-server with their --https option. But nada with preact serve.

On a related note, preact serve also seems to break http connections to localhost, since they always get redirected to https. I had to use this SO answer to fix it.

Error with service worker when depoloying to firebase

I'm seeing a bunch of erros (below) in the browser console after deploying a newly created app to firebase. Looks like the sw is referencing my local files instead of the ones in the server.

I'm on Windows 10 and I had a similar issue with create-react-app that they fixed with this commit: facebook/create-react-app@22ca584

sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/2.chunk.dee19c0c2b89ad8a3492.js?_sw-precache=cecc045fb475b3d5f4f96d2140782cf1. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/favicon.ico?_sw-precache=53ac170e970ad034a55ee15ce198708c. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/icons/android-chrome-192x192.png?_sw-precache=1ea58b225a597f78adfd987ed164e573. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/icons/android-chrome-512x512.png?_sw-precache=b65626103d4cd30abdb0423e6ab15179. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/icons/apple-touch-icon.png?_sw-precache=4e32b9c4edcb5babb823e4824f90bb8d. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/icons/favicon-16x16.png?_sw-precache=2cbedfd68f59e42b0d03ba3946863ee7. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/icons/favicon-32x32.png?_sw-precache=b9108564a20f06675f60b29337c71b3e. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/assets/icons/mstile-150x150.png?_sw-precache=3eb725b0686148a67f2feb546670b313. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/bundle.js?_sw-precache=d5bb8d2c92704cc0f102c0896195782e. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/favicon.ico?_sw-precache=53ac170e970ad034a55ee15ce198708c. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/index.html?_sw-precache=f1b6dd4db31797ed11807b114bcbdae2. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/manifest.json?_sw-precache=409a6ab1239000b8c4b64cf7c808d616. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/polyfills.chunk.906967bd865a58e79868.js?_sw-precache=fc493e4fc1f1a71239b36865099aaf69. URL scheme must be "http" or "https" for CORS request. (anonymous) @ sw.js:1 (anonymous) @ sw.js:1 sw.js:1 Fetch API cannot load file:///D:/projects/pwa/preact/one/build/style.css?_sw-precache=3ce120ab4c8b971cba535fc84d789361. URL scheme must be "http" or "https" for CORS request.

Installation errors and warnings

I'm having trouble installing preact-cli this morning. Tested on MacOS and inside a fresh linux vm and docker image:

$ npm install -g preact-cli
/usr/local/bin/preact -> /usr/local/lib/node_modules/preact-cli/lib/index.js

> [email protected] install /usr/local/lib/node_modules/preact-cli/node_modules/fsevents
> node install

[fsevents] Success: "/usr/local/lib/node_modules/preact-cli/node_modules/fsevents/lib/binding/Release/node-v51-darwin-x64/fse.node" is installed via remote

> [email protected] postinstall /usr/local/lib/node_modules/preact-cli/node_modules/simplehttp2server
> node lib/install.js

  ⚠ The `/usr/local/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor/simplehttp2server` binary doesn't seem to work correctly
  ⚠ simplehttp2server pre-build test failed
  ℹ compiling from source
  ✖ Error: mkdir -p /usr/local/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor && sh crosscompile.sh && mv ./57924994-9b31-49b1-afa2-51924472b375_darwin_amd64 /usr/local/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor/simplehttp2server
Command failed: sh crosscompile.sh && mv ./57924994-9b31-49b1-afa2-51924472b375_darwin_amd64 /usr/local/lib/node_modules/preact-cli/node_modules/simplehttp2server/vendor/simplehttp2server
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
	/usr/local/Cellar/go/1.8.1/libexec/src/github.com/NYTimes/gziphandler (from $GOROOT)
	/Users/marvinhagemeister/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
	/usr/local/Cellar/go/1.8.1/libexec/src/github.com/NYTimes/gziphandler (from $GOROOT)
	/Users/marvinhagemeister/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
	/usr/local/Cellar/go/1.8.1/libexec/src/github.com/NYTimes/gziphandler (from $GOROOT)
	/Users/marvinhagemeister/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
	/usr/local/Cellar/go/1.8.1/libexec/src/github.com/NYTimes/gziphandler (from $GOROOT)
	/Users/marvinhagemeister/go/src/github.com/NYTimes/gziphandler (from $GOPATH)
simplehttp2server.go:24:2: cannot find package "github.com/NYTimes/gziphandler" in any of:
	/usr/local/Cellar/go/1.8.1/libexec/src/github.com/NYTimes/gziphandler (from $GOROOT)
	/Users/marvinhagemeister/go/src/github.com/NYTimes/gziphandler (from $GOPATH)

    at ChildProcess.exithandler (child_process.js:205:12)
    at emitTwo (events.js:106:13)
    at ChildProcess.emit (events.js:194:7)
    at maybeClose (internal/child_process.js:899:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
/usr/local/lib

# ... (long npm output here)

npm WARN [email protected] requires a peer of preact@* but none was installed.

The last error, that preact is not installed properly should be an easy fix. The issue with simplehttp2server seems a bit more involved.

Not Being able to edit or configure index.html

I don't know if this is intentional but, I think that would be nice to have the index.html open to the CLI user, this way we can configure some stuff.

build problem with sass/scss

Hello.
It is just not working.
I've tried .scss, .sass files, but builder fails with error message

Template execution failed: Error: Cannot find module './style' ...

.less files with (and without) -l option is working fine

Am I doing something wrong?

No git repo initiated with project

When creating a new project no git repo was initiated at all. Not sure what would be the standard, but would be nice if a git repo was started, with a .gitignore setup inside as well.

Extending default configuration

Hi there,
incredible work on the cli & tooling configuration. However, even the greatest config does not meet all needs and thus the question - Do you have plans on allowing users to extend default configuration?

Some use cases as a conversation starting point:

large part of the community likes to follow components & containers folder structure when working with redux and aliasing those in webpack helps with large import paths (i.e.import Header from '../../../../components/Header) - normally this would be done via babel plugin or webpack alias,
Service Workers are great because they can cache static files but they are even better because they allow runtime caching - this would require changing plugin
when server side rendering <script defer /> might be better than <script async /> - again changing plugin config
a new cool kid appears around the block (e.g. prepack) and users want to use it - adding new plugin and in order

AFAIK create-react-app have chosen not to allow changing configuration. However they provide eject functionality which generates all config files (docs).
The only problem with this is that once ejected there's no easy way with keeping ejected config in sync with create-react-app.

`preact build` doesn't exit with proper code on error

preact build always exit with code = 0 where there are errors or not. And this is pretty annoying because you can't catch this on CI.

P/s: After a quick digging, a try ...catch block is missing here https://github.com/developit/preact-cli/blob/35fd84a86fe6b6c8abd60aeb721494771930c4ff/src/commands/build.js#L41 .
I think it's the root of this evil

Failure to compile

After running react run create profile --sass I noticed the following error:

Failed to compile with 1 error.

 ERROR  in /Users/ahcarpenter/.config/yarn/global/~/nwb/lib/preactRunEntry.js
Module not found: Error: Can't resolve 'nwb-preact-run-entry' in '/Users/ahcarpenter/.config/yarn/global/node_modules/nwb/lib'
 @ /Users/ahcarpenter/.config/yarn/global/~/nwb/lib/preactRunEntry.js 36:14-45 42:2-49
 @ multi /Users/ahcarpenter/.config/yarn/global/~/nwb/polyfills.js /Users/ahcarpenter/.config/yarn/global/~/eventsource-polyfill/dist/browserify-eventsource.js /Users/ahcarpenter/.config/yarn/global/~/webpack-hot-middleware/client.js /Users/ahcarpenter/.config/yarn/global/~/nwb/lib/preactRunEntry.js

node v6.10.3
preact v0.15.8

Any thoughts?

preact build error

Hello,
Getting SyntaxError on preact build while npm start works properly

Build [==================  ] 91% (1.9s) additional asset processing
  Total precache size is about 180 kB for 15 resources.

Template execution failed: SyntaxError: Unexpected token {
  SyntaxError: Unexpected token {
  
  - node.js:152 Object.require.extensions.(anonymous function) [as .js]
    [lib]/[preact-cli]/[babel-register]/lib/node.js:152:7
  
  - module.js:12 require
    internal/module.js:12:17
  
  - index.js:3 Object.<anonymous>
    [lib]/[preact-cli]/[postcss-modules-resolve-imports]/index.js:3:18
  
  - node.js:152 Object.require.extensions.(anonymous function) [as .js]
    [lib]/[preact-cli]/[babel-register]/lib/node.js:152:7
  
  - module.js:12 require
    internal/module.js:12:17
  
  - index.js:24 Object.<anonymous>
    [lib]/[preact-cli]/[css-modules-require-hook]/lib/index.js:24:22
  
  - node.js:152 Object.require.extensions.(anonymous function) [as .js]
    [lib]/[preact-cli]/[babel-register]/lib/node.js:152:7

npm run build building with system url path

When I run npm run build the sw.js is generated with system paths to the archives:

"C:/Users/jordao/projects/compra/build/1.chunk.82189a4e17c69863082e.js"

instead of:

"1.chunk.82189a4e17c69863082e.js"

Dev Server Proxy

Hello,

First off, I just want to say thank you for creating and maintaining this amazing tool, it's an absolute delight to work with and makes it just so easy and quick to get a Preact PWA up and running.

This may be more of a feature request, but is there any way to specify a proxy for the development server to intercept/redirect calls in either the package.json or another configuration file?

Thank you for any help you can provide.

SASS not being used even when specified

Cannot get the CLI to initialize a new project with SASS as default.

I have tried:

preact create app --name dashboard --sass --dest dashboard --type full (inits with less)
preact create app --sass or even preact create app --sass=true (inits with css)

node -v: v6.9.0
npm -v: 3.10.8

Is it intentional that the eslint-config-synacor is referenced in the package.json but not in devDependencies?

Visual Studio Code throws an error if an eslint-config is not present in the node_modules directory.

Using port flag isn't reflected in dev server notice

I just installed preact-cli 1.0.1. I modified the dev script to use the -p flag. Now when I run npm start or npm run dev the server is started on the port correct but the dev server notice still displays the default port (8080).

This is my console's output.

dev/test-pwa » npm run dev

> [email protected] dev /Users/me/dev/test-pwa
> preact watch -p 8001

  > Development server started at http://localhost:8080

Again, the dev server is correctly running on the right port but the error is with the notice.

`preact build --prerender` blows up with nvm?

I use nvm and preact build --prerender blows and does not build to the build directory. I get this error:

/Users/sashton/.nvm/versions/node/v7.8.0/lib/~/preact-cli/lib/lib/entry.js
Module not found: Error: Can't resolve 'preact' in '/Users/sashton/.nvm/versions/node/v7.8.0/lib/node_modules/preact-cli/lib/lib'

Plus lots of other output. Is the app directory resolution breaking somehow? Somehow it's trying to fetch the version of Preact installed for the global preact-cli instead of the local application `preact'

Add optional support for TypeScript

The webpack config already lists .ts and .tsx as resolvable extensions, but it seems like the loader for ts is missing.