Hi. I have a React component that import a .css and I would want to know how to include that file into my dist folder, because the file is not event moved.

Also I want to know how to already import the css into my js file to avoid the error dist/styles.css Unexpected token when my module is requested.

Thank you for your help.

Apparently "prepublish" is changing in npm5 to only run on publish - http://blog.lholmquist.org/npm-prepublish-changes/.

To keep this boilerplate working in npm5, it appears to be as simple as change "prepublish" in package.json to "prepare".

I can raise a PR if you like?

Sorry I'm a real beginner ...
I forked the package, then copied the content of the forked package to my own package (using $ cp -a react-npm-boilerplate/. react-my-custom-package/), but I guess it's not the right way to go : I cannot commit the new files.

I'm sure I will find how to do this on the internet, but I would have liked it to be part of the Readme. I will update this issue with my findings, and I will try doing a PR on the Readme for the other beginners.

The script is only one line, so I don't really need to have one extra file just for that.
You could use directly on your package.json IMO:

{
   "prepublish": "babel --plugins 'transform-runtime' src --ignore __tests__ --out-dir ./dist"
}

npm WARN deprecated [email protected]: to-iso-string has been deprecated, use @segment/to-iso-string instead.
npm WARN deprecated [email protected]: Jade has been renamed to pug, please install the latest version of pug instead of jade
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue

[email protected] prepublish C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid
babel --plugins 'transform-es2015-modules-umd' src --ignore tests --out-dir ./dist

ReferenceError: Unknown plugin "'transform-es2015-modules-umd'" specified in "base" at 0, attempted to resolve relative to "src"
at C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\file\options\option-manager.js:176:17
at Array.map (native)
at Function.normalisePlugins (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\file\options\option-manager.js:154:20)
at OptionManager.mergeOptions (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\file\options\option-manager.js:229:36)
at OptionManager.init (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\file\options\option-manager.js:374:12)
at File.initOptions (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\file\index.js:216:65)
at new File (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\file\index.js:139:24)
at Pipeline.transform (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
at transform (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-cli\lib\babel\util.js:50:22)
at Object.compile (C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\node_modules\babel-cli\lib\babel\util.js:59:12)

npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: [email protected]
npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Users\Moto\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js" "install"
npm ERR! node v6.9.1
npm ERR! npm v3.8.8
npm ERR! code ELIFECYCLE
npm ERR! [email protected] prepublish: babel --plugins 'transform-es2015-modules-umd' src --ignore __tests__ --out-dir ./dist
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] prepublish script 'babel --plugins 'transform-es2015-modules-umd' src --ignore tests --out-dir ./dist'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the react-npm-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! babel --plugins 'transform-es2015-modules-umd' src --ignore tests --out-dir ./dist
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs react-npm-boilerplate
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls react-npm-boilerplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\Moto\Documents\Projects\Mark\material-ui-layout\material-layout\material-grid\npm-debug.log

If you don't know about rollup, I highly recommend having a look into it.
It can output a much smaller distribution file than using babel directly.

I've released a simple react library and I did a lot of tests before deciding to stick with Rollup - it's a big difference, you should give it a try too. The config would be something like this:

import babel from 'rollup-plugin-babel';
import replace from 'rollup-plugin-replace';
import commonjs from 'rollup-plugin-commonjs';
import nodeResolve from 'rollup-plugin-node-resolve';

export default {
  moduleName: 'NameOfYourModuleForAMD',
  entry: './src/index.js',
  dest: './dist/index.js',
  format: 'umd',
  plugins: [babel(), commonjs()],
  globals: {
    react: 'React' // because you don't want to include React on the bundled js
  }
};

Plus you have the benefit of having a UMD package.

And just one smaller thing, I would add "react" as a peerDependency so people can choose the React version they want to use.