0
我爲我的項目中的某個模塊使用第三方庫。我也想爲圖書館做出貢獻，所以我使用npm鏈接，以便我的代碼更改更容易管理。當我試圖通過NPM通常包括庫/ node_modules包加載成功，但是當我移動到另一個文件夾，使用NPM鏈接它拋出這個錯誤節點模塊工作，但不是如果使用npm鏈接
ERROR in ../react-google-maps/lib/utils/index.js
Module not found: Error: Cannot resolve module 'babel'
這裏是我的package.json
{
"name": "Test",
"version": "1.0.0",
"description": "Logistics",
"author": "wnoveno",
"main": "index.js",
"scripts": {
"start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --port 9000",
"build": "webpack -p",
"test": "mocha --compilers js:babel-core/register --require ./test/test_helper.js --recursive ./test",
"test:watch": "npm run test -- --watch"
},
"license": "ISC",
"devDependencies": {
"babel-cli": "^6.5.1",
"babel-core": "^6.5.2",
"babel-loader": "^6.2.0",
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"babel-preset-stage-0": "^6.5.0",
"babel-preset-stage-1": "^6.1.18",
"chai": "^3.5.0",
"chai-jquery": "^2.0.0",
"jquery": "^2.2.1",
"jsdom": "^8.1.0",
"mocha": "^2.4.5",
"webpack": "^1.12.9",
"webpack-dev-server": "^1.14.0"
},
"dependencies": {
"axios": "^0.11.0",
"babel-runtime": "^6.9.2",
"classnames": "^2.2.5",
"css-loader": "^0.23.1",
"extract-text-webpack-plugin": "^1.0.1",
"http-server": "^0.9.0",
"immutable": "^3.8.1",
"lodash": "^4.13.1",
"moment": "^2.13.0",
"node-sass": "^3.4.2",
"postcss-loader": "^0.9.1",
"react": "^15.0.0",
"react-big-calendar": "^0.9.12",
"react-bootstrap": "^0.29.5",
"react-cookie": "^0.4.6",
"react-dom": "^15.0.0",
"react-redux": "^4.4.5",
"react-redux-loading-bar": "^2.0.2",
"react-router": "^2.4.1",
"react-router-redux": "^4.0.5",
"react-tap-event-plugin": "^1.0.0",
"redux": "^3.0.4",
"redux-form": "^5.0.0",
"redux-localstorage": "^0.4.0",
"redux-persist": "^3.1.1",
"redux-promise": "^0.5.3",
"redux-promise-middleware": "^3.2.0",
"redux-thunk": "^2.1.0",
"sass-loader": "^3.2.0",
"style-loader": "^0.13.1"
}
}
和webpack.config
const path = require('path')
module.exports = {
entry: [
'./src/index.js'
],
output: {
path: __dirname,
publicPath: '/',
filename: 'bundle.js'
},
module: {
loaders: [{
exclude: /node_modules/,
loader: 'babel'
},
{
test: /(\.scss|\.css)$/,
loaders: ['style', 'css', 'sass']
}]
},
resolve: {
root: [path.resolve(__dirname, 'src')],
extensions: ['', '.js', '.jsx', '.scss'],
modulesDirectories: [
'node_modules',
path.resolve(__dirname, './node_modules'),
path.resolve(__dirname, './node_modules/react-google-maps/lib'),
]
},
// resolveLoader: {
// modulesDirectories: [
// './node_modules/react-google-maps/node_modules/babel-cli'
// ]
// },
devServer: {
historyApiFallback: true,
contentBase: './'
},
externals: {
'config': JSON.stringify(require('./config-dev.json'))
},
}
const path = require('path')
module.exports = {
entry: [
'./src/index.js'
],
output: {
path: __dirname,
publicPath: '/',
filename: 'bundle.js'
},
module: {
loaders: [{
exclude: /node_modules/,
loader: 'babel'
},
{
test: /(\.scss|\.css)$/,
loaders: ['style', 'css', 'sass']
}]
},
resolve: {
root: [path.resolve(__dirname, 'src')],
extensions: ['', '.js', '.jsx', '.scss'],
modulesDirectories: [
'node_modules',
path.resolve(__dirname, './node_modules'),
path.resolve(__dirname, './node_modules/react-google-maps/lib'),
]
},
// resolveLoader: {
// modulesDirectories: [
// './node_modules/react-google-maps/node_modules/babel-cli'
// ]
// },
devServer: {
historyApiFallback: true,
contentBase: './'
},
externals: {
'config': JSON.stringify(require('./config-dev.json'))
},
}
這裏的包的的package.json
{
"name": "react-google-maps",
"version": "5.0.0",
"description": "React.js Google Maps integration component",
"main": "src/index.js",
"files": [
"lib/",
"src/",
"CHANGELOG.md"
],
"scripts": {
"clean": "rimraf lib",
"prebuild": "npm run lint && npm run clean",
"build:watch": "npm run build -- --watch",
"build": "cross-env NODE_ENV=production babel src --out-dir lib",
"lint": "cross-env NODE_ENV=test eslint .",
"pretest:cov": "npm run lint",
"pretest": "npm run lint",
"test:cov": "cross-env NODE_ENV=test babel-node ./node_modules/.bin/isparta cover --report lcov _mocha -- $npm_package_config_mocha",
"test:watch": "npm test -- --watch",
"test": "cross-env NODE_ENV=test mocha $npm_package_config_mocha",
"prerelease": "npm run build && git add -A && git commit -m 'chore(lib): compile from src using babel'",
"release": "standard-version"
},
"config": {
"mocha": "--compilers js:babel-register ./src/**/__tests__/*.spec.js --require ./src/__tests__/setup.js"
},
"repository": {
"type": "git",
"url": "https://github.com/tomchentw/react-google-maps"
},
"keywords": [
"React.js",
"React",
"react-component",
"google",
"map",
"maps",
"place",
"places",
"googlemap",
"googlemaps",
"google-map",
"google-maps",
"google map",
"google maps",
"GoogleMapsMixin",
"Map",
"Marker",
"Polyline",
"Polygon",
"Circle",
"Directions",
"InfoWindow",
"SearchBox"
],
"author": {
"name": "tomchentw",
"email": "[email protected]",
"url": "https://github.com/tomchentw"
},
"license": "MIT",
"bugs": {
"url": "https://github.com/tomchentw/react-google-maps/issues"
},
"homepage": "https://tomchentw.github.io/react-google-maps/",
"devDependencies": {
"babel-cli": "^6.5.1",
"babel-core": "^6.5.2",
"babel-eslint": "^6.0.4",
"babel-plugin-lodash": "^3.1.4",
"babel-plugin-transform-flow-comments": "^6.5.0",
"babel-plugin-transform-runtime": "^6.9.0",
"babel-plugin-typecheck": "^3.6.1",
"babel-preset-es2015": "^6.5.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "^6.5.0",
"babel-register": "^6.5.2",
"codeclimate-test-reporter": "^0.3.1",
"cross-env": "^1.0.7",
"eslint": "^2.2.0",
"eslint-config-airbnb": "^9.0.1",
"eslint-plugin-flowtype": "^2.4.0",
"eslint-plugin-import": "^1.8.1",
"eslint-plugin-jsx-a11y": "^1.2.2",
"eslint-plugin-react": "^5.1.1",
"expect": "^1.14.0",
"isparta": "^4.0.0",
"istanbul": "^0.4.2",
"jsdom": "^9.2.1",
"mocha": "^2.4.5",
"react": "^15.1.0",
"react-dom": "^15.1.0",
"rimraf": "^2.5.2",
"standard-version": "^2.2.1",
"tomchentw-npm-dev": "^4.0.0"
},
"dependencies": {
"babel-runtime": "^6.9.2",
"can-use-dom": "^0.1.0",
"google-maps-infobox": "^1.1.13",
"invariant": "^2.1.1",
"lodash": "^4.13.1",
"marker-clusterer-plus": "^2.1.4",
"react-prop-types-element-of-type": "^2.1.0",
"scriptjs": "^2.5.8",
"warning": "^2.1.0"
},
"peerDependencies": {
"react": "^0.14.0 || ^15.0.0",
"react-dom": "^0.14.0 || ^15.0.0"
}
}
你可以嘗試在另一個文件夾中單獨安裝嗎？ – codeinprogress
是在單獨的文件夾上安裝npm可以。但是，如果它在一個單獨的文件夾中，webpack似乎無法識別加載器。這是我爲什麼不認可巴貝爾的猜測。 – wnoveno
你能告訴我們*你究竟如何鏈接？ –