I am using Webpack 1 with babel6 and devServer and am trying to display the es6 source in Chrome/Safari, So far I only get to see the generated es5 code. Here is my .babelrc
{ "presets": ["es2015", "react", "stage-0"] }
and the webpack.config.js:
var webpack = require('webpack') var path = require('path'); config = { entry: { admin_index: [ 'babel-polyfill', './app/bundles/admin/index-entry.js' ], }, output: { path: path.resolve(__dirname, '../app/assets/javascripts/dist/'), filename: '[name]-bundle.js', }, module: { cache: true, loaders: [ { test: /\.jsx?$/, // loader: 'babel', loader: 'happypack/loader', exclude: /node_modules|bower_modules/, include: [ path.join(__dirname, "app/bundles"), ], query: { cacheDirectory: true, } }, ] }, resolve:{ extensions: ['', '.js', '.jsx'], modulesDirectories: ["node_modules"], }, devtool: 'eval-source-map', plugins:[ new HappyPack({ loaders: [ 'babel?presets[]=es2015&presets[]=react&presets[]=stage-0'], threads: 8, }) ], watchOptions: { ignored: /node_modules/ }, } module.exports = config
I inlcuded a screenshot of the Chrome Resources tab's source
package.json
{ "name": "client", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "NODE_ENV=test mocha './app/**/*.spec.js' --compilers js:babel-register --recursive --require testSetup.js", "test:watch": "npm test -- --watch", "start": "NODE_ENV=dev node server.js" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.7.4", "babel-eslint": "^6.0.4", "babel-loader": "^6.2.4", "babel-plugin-react-hot": "^1.0.4", "babel-plugin-transform-flow-strip-types": "^6.18.0", "babel-polyfill": "^6.7.4", "babel-preset-es2015": "^6.6.0", "babel-preset-react": "^6.5.0", "babel-preset-stage-0": "^6.5.0", "babel-register": "^6.7.2", "css-loader": "^0.23.1", "enzyme": "^2.2.0", "eslint": "^2.6.0", "eslint-plugin-react": "^5.0.1", "expect": "^1.16.0", "happypack": "^2.1.1", "jsdom": "^8.2.0", "mocha": "^2.4.5", "mocha-jsdom": "^1.1.0", "node-sass": "^3.4.2", "npm-check-updates": "^2.8.9", "npm-install-webpack-plugin": "^3.0.0", "react-addons-perf": "^15.1.0", "react-addons-test-utils": "^15.1.0", "react-hot-loader": "^3.0.0-beta.6", "react-render-visualizer": "^0.2.2", "redux-devtools": "^3.3.1", "redux-devtools-dock-monitor": "^1.1.1", "redux-devtools-log-monitor": "^1.0.11", "sinon": "^1.17.3", "style-loader": "^0.13.1", "webpack": "^1.13.1", "webpack-dev-server": "^1.14.1", "webpack-notifier": "^1.3.0", "why-did-you-update": "0.0.8" }, "dependencies": { "Faker": "^0.7.2", "aphrodite": "^1.1.0", "axios": "^0.12.0", "classnames": "^2.2.5", "color": "^0.11.3", "counterpart": "^0.17.4", "cuid": "^1.3.8", "damals": "^0.9.4", "delay": "^1.3.1", "draft-js": "^0.7.0", "draft-js-export-html": "^0.3.0", "fecha": "^2.1.0", "file-loader": "^0.8.5", "halogen": "^0.2.0", "history": "^2.0.1", "humanize-plus": "^1.8.2", "intl": "^1.1.0", "lodash": "^4.13.1", "memoizee": "^0.3.10", "normalizr": "^2.1.0", "pluralize": "^3.0.0", "query-string": "^4.2.2", "query-string-parser": "^0.1.4", "react": "^15.1.0", "react-addons-shallow-compare": "^15.1.0", "react-dnd": "^2.1.4", "react-dnd-html5-backend": "^2.1.2", "react-dom": "^15.1.0", "react-dropzone": "^3.4.0", "react-functional": "^1.2.0", "react-grid-layout": "^0.13.0", "react-modal": "^1.4.0", "react-player": "^0.12.0", "react-redux": "^4.4.5", "react-router": "^3.0.0-beta.1", "react-router-redux": "^4.0.0", "react-rte": "^0.5.0", "react-select": "^1.0.0-rc.2", "react-stateless": "^0.2.1", "redux": "^3.5.2", "redux-crud": "^1.0.0", "redux-form": "^5.2.5", "redux-saga": "^0.14.2", "reselect": "^2.2.1", "seamless-immutable": "^5.1.1", "url-loader": "^0.5.7" } }
Can anyone spot anything that I might have had wrong in the config that prevents me from seeing the es6 in the chrome source tab?
Thank you!
0 comments:
Post a Comment