thelarkinn / angular-starter-es6-webpack Goto Github PK

Add testing suite. Help ensure that the boilerplate out of the box works, etc.

replace eval with proper es6 sourcemap in dev env, don't forget package.json.

Static inject doesn't work in the current configuration.

Hi,

am getting error ,when i run

'export' is not recognized as an internal or external command

I run npm run build and npm run dev

I kept getting

> [email protected] build /Users/bheng/Sites/angular/angular-starter-es6-webpack
> export NODE_ENV=production && node node_modules/.bin/webpack && cp app/index.html dist/index.html

Hash: e073f399fd5c43d808a6
Version: webpack 1.15.0
Time: 8043ms
        Asset     Size  Chunks             Chunk Names
    vendor.js   267 kB       0  [emitted]  vendor
vendor.js.map  4.38 MB       0  [emitted]  vendor
   [0] multi vendor 52 bytes {0} [built]
    + 6 hidden modules

WARNING in vendor.js from UglifyJs
Dropping unused variable arrayMode [../~/angular-ui-router/release/angular-ui-router.js:791,0]
Side effects in initialization of unused variable ignoreUpdate [../~/angular-ui-router/release/angular-ui-router.js:2035,0]
Dropping unused variable cfg [../~/angular-ui-router/release/angular-ui-router.js:917,15]
Dropping unused function indexBy [../~/angular-ui-router/release/angular-ui-router.js:166,0]
Dropping unused function pluck [../~/angular-ui-router/release/angular-ui-router.js:196,0]
Dropping unused function nodesetLinkingFn [../~/angular/angular.js:10756,0]
Dropping unused function directiveLinkingFn [../~/angular/angular.js:10763,0]
Side effects in initialization of unused variable support [../~/lodash/index.js:932,0]
Condition always true [../~/lodash/index.js:12323,0]
Dropping unreachable code [../~/lodash/index.js:12337,0]
Side effects in initialization of unused variable moduleExports [../~/lodash/index.js:266,0]

ERROR in Cannot find module 'lodash/cloneDeep'

Any hints ?

Having this while running npm run dev

0 info it worked if it ends with ok
1 verbose cli [ 'C:\Program Files\nodejs\node.exe',
1 verbose cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'dev' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predev', 'dev', 'postdev' ]
5 info lifecycle [email protected]predev: [email protected]
6 silly lifecycle [email protected]predev: no script for predev, continuing
7 info lifecycle [email protected]dev: [email protected]
8 verbose lifecycle [email protected]dev: unsafe-perm in lifecycle true
9 verbose lifecycle [email protected]dev: PATH: C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;C:\Users\Дарья\Test\angular-starter-es6-webpack\node_modules.bin;C:\Program Files\nodejs;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Program Files\Git\cmd;C:\Program Files\nodejs;C:\Program Files (x86)\Skype\Phone;%SystemRoot%\system32;%SystemRoot%;%SystemRoot%\System32\Wbem;%SYSTEMROOT%\System32\WindowsPowerShell\v1.0;C:\Ruby200-x64\bin;C:\Users\Дарья\AppData\Local\Microsoft\WindowsApps;C:\Users\Дарья\AppData\Local\atom\bin;C:\Users\Дарья\AppData\Roaming\npm;C:\Users\Дарья\AppData\Local\Microsoft\WindowsApps;
10 verbose lifecycle [email protected]dev: CWD: C:\Users\Дарья\Test\angular-starter-es6-webpack
11 silly lifecycle [email protected]dev: Args: [ '/d /s /c',
11 silly lifecycle 'export NODE_ENV=development && webpack-dev-server --devtool=source-map --progress --colors --port=9000 --content-base app' ]
12 silly lifecycle [email protected]dev: Returned: code: 1 signal: null
13 info lifecycle [email protected]~dev: Failed to exec dev script
14 verbose stack Error: [email protected] dev: export NODE_ENV=development && webpack-dev-server --devtool=source-map --progress --colors --port=9000 --content-base app
14 verbose stack Exit status 1
14 verbose stack at EventEmitter. (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:242:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:191:7)
14 verbose stack at ChildProcess. (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:191:7)
14 verbose stack at maybeClose (internal/child_process.js:877:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid [email protected]
16 verbose cwd C:\Users\Дарья\Test\angular-starter-es6-webpack
17 error Windows_NT 10.0.15063
18 error argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "dev"
19 error node v6.6.0
20 error npm v3.10.3
21 error code ELIFECYCLE
22 error [email protected] dev: export NODE_ENV=development && webpack-dev-server --devtool=source-map --progress --colors --port=9000 --content-base app
22 error Exit status 1
23 error Failed at the [email protected] dev script 'export NODE_ENV=development && webpack-dev-server --devtool=source-map --progress --colors --port=9000 --content-base app'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the angular-starter-es6-webpack package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error export NODE_ENV=development && webpack-dev-server --devtool=source-map --progress --colors --port=9000 --content-base app
23 error You can get information on how to open an issue for this project with:
23 error npm bugs angular-starter-es6-webpack
23 error Or if that isn't available, you can get their info via:
23 error npm owner ls angular-starter-es6-webpack
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]

Replace vm with the name of the actual controller cause vm sucks and is unhelpful.

@kentcdodds has a neat set of video tuts on doing this for projects. Probably following his path will assist.

I think this also requires big boy change logs with semantic-release.

On initial clone, trying to make a new component, you have to npm install --save gulp-inject-string and npm install --save merge-stream before gulp component --name foo works.

While running $ npm dev, the console logs "Uncaught RangeError: Maximum call stack size exceeded" error after saving changes.

SOLUTION: https://github.com/webpack/webpack-dev-server/issues/87
REASON: "You shouldn't be doing --hot and new webpack.HotModuleReplacementPlugin() in webpack.config.js > plugins: [] section simultaneously."

./app/index.scss
Module not found: Error: Cannot resolve 'file' or 'directory' ../node_modules/css-loader/index.js in C:\AJs\ajswp/app
resolve file
C:\AJs\node_modules\css-loader\index.js doesn't exist
C:\AJs\node_modules\css-loader\index.js.web-loader.js doesn't exist
C:\AJs\node_modules\css-loader\index.js.loader.js doesn't exist
C:\AJs\node_modules\css-loader\index.js.webpack-loader.js doesn't exist
C:\AJs\node_modules\css-loader\index.js.js doesn't exist
resolve directory
C:\AJs\node_modules\css-loader\index.js doesn't exist (directory default file)
C:\AJs\node_modules\css-loader\index.js\package.json doesn't exist (directory description file)
[C:\AJs\node_modules\css-loader\index.js]
[C:\AJs\node_modules\css-loader\index.js.web-loader.js]
[C:\AJs\node_modules\css-loader\index.js.loader.js]
[C:\AJs\node_modules\css-loader\index.js.webpack-loader.js]
[C:\AJs\node_modules\css-loader\index.js.js]
@ ./app/index.scss 4:14-191 13:2-17:4 14:20-197

./app/index.scss
Module not found: Error: Cannot resolve 'file' or 'directory' ../node_modules/style-loader/addStyles.js in C:\AJs\ajswp/app
resolve file
C:\AJs\node_modules\style-loader\addStyles.js doesn't exist
C:\AJs\node_modules\style-loader\addStyles.js.webpack.js doesn't exist
C:\AJs\node_modules\style-loader\addStyles.js.web.js doesn't exist
C:\AJs\node_modules\style-loader\addStyles.js.js doesn't exist
C:\AJs\node_modules\style-loader\addStyles.js.json doesn't exist
resolve directory
C:\AJs\node_modules\style-loader\addStyles.js doesn't exist (directory default file)
C:\AJs\node_modules\style-loader\addStyles.js\package.json doesn't exist (directory description file)
[C:\AJs\node_modules\style-loader\addStyles.js]
[C:\AJs\node_modules\style-loader\addStyles.js.webpack.js]
[C:\AJs\node_modules\style-loader\addStyles.js.web.js]
[C:\AJs\node_modules\style-loader\addStyles.js.js]
[C:\AJs\node_modules\style-loader\addStyles.js.json]
@ ./app/index.scss 7:13-66

Replace jslint with eslint

Looks like the SCSS path thats added to index.scss is referencing common components in ~components/... instead and this causes build errors.

Use ES6 for webpack configuration? Requires the use of babel in the project level.

For the template generators the class name for the the component is:

<div class='.<%= name %>'>
  <h1>{{ vm.name }}</h1>
</div>

Need to remove trailing period.

During development (npm run dev), source maps should be generated.

When source map generation is fully working, a thrown error should show up in the developer console referencing the original file name, and the correct line number, of the original ES6 JS file.

In package.json we should see the following:

"scripts": {
    "dev": "export NODE_ENV=development && webpack-dev-server --devtool eval --progress --colors --port=9000 --hot --content-base app",
    "test": "export NODE_ENV=test && karma start",
    "build": "export NODE_ENV=production && node node_modules/.bin/webpack && cp app/app.html dist/index.html"
  },

Currently this webpack.config.js is one file. We should break this up into multiple packages so that we can have a more modular and maintainable set of env. specific bundling configurations.