I wrote some npm scripts that builds the ./lib
directory before publish to npm.
1. script is responsible to convert all es6
*.js
files in ./src/components/
to es5
syntax and then copy the files to ./lib
(same structure).
This is the script:
"cross-env NODE_ENV=production babel ./src/components --out-dir ./lib --ignore spec.js --copy-files"
And this is the .babelrc
file:
{
"presets": [
"react",
"stage-1"
],
"env": {
"development": {
"presets": [
"latest",
"react-hmre"
]
},
"production": {
"presets": [
[
"latest",
"es2015"
]
],
"plugins": [
"transform-react-constant-elements",
"transform-react-remove-prop-types",
[
"transform-imports",
{
"react-bootstrap": {
"transform": "react-bootstrap/lib/${member}",
"preventFullImport": true
},
"lodash": {
"transform": "lodash/${member}",
"preventFullImport": true
}
}
]
]
},
"test": {
"presets": [
"latest"
]
}
}
}
I have another script that responsible to convert .less
files to .css
and copy them to ./lib
(same structure):
"lessc-glob ./src/components/**/*.less lib"
Everything works well as expected, but i have one problem now. The import
that i have inside the .js
files are referring to .less
files, but i need it to change to .css
extensions.
To make things clear,
What i have now is:
import css from './styles.less';
Converted into this:
var _styles = require('./styles.less');
But i want it to convert to this:
var _styles = require('./styles.css');
via Sag1v
No comments:
Post a Comment