Я новичок в Webpack и пытаюсь использовать API Twitter в проекте. Все работает нормально, пока мне не потребуются зависимости Twitter и файл конфигурации. Затем я получаю следующие сообщения об ошибках:
Can't resolve 'fs'
Can't resolve 'net'
Can't resolve 'tls'
Это мой package.json
{
"name": "webpack-4-setup",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack --mode development",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-preset-env": "^1.6.1",
"webpack": "^4.6.0",
"webpack-cli": "^2.1.2"
},
"dependencies": {
"twitter": "^1.7.1"
}
}
config.js
module.exports = {
consumer_key: '',
consumer_secret: '',
access_token_key: '',
access_token_secret: ''
}
index.js
const Twitter = require('twitter');
const config = require('./config.js');
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
}
]
}
};
Я искал ответ, но не нашел объяснения, что случилось. Я нашел ответ в добавлении
node: {
net: "empty",
tls: "empty"
}
в webpack.config, но это дает другую ошибку: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
Может кто-нибудь объяснить, что я делаю не так и что здесь происходит? Буду очень благодарен!
файловая структура проекта:
project
-dist
---main.js
-index.html
-node_modules
-package-lock.json
-package.json
-src
---config.js
---index.js
-webpack.config.js
Моя файловая структура: проект -dist --- main.js -index.html -node_modules -package-lock.json -package.json -src --- config.js --- index.js -webpack.config.js Это интерфейсное приложение
Хорошо, поэтому вы должны понимать, что пакет twitter
, который вы пытаетесь использовать, является модулем nodejs и работает над серверным приложением. Другими словами, вам нужно найти реализацию твиттера на стороне клиента или создать свой собственный класс.
Но я нашел несколько примеров использования пакета twitter npm с js, и когда я попытался запустить пример, он работал с терминала, но не с браузера. Значит, вы говорите, что использовать пакет npm невозможно?
терминал не является браузером. Вы выполняли js-код в nodejs.
Я нашел этот github.com/liady/webpack-node-externals, если я правильно понимаю, Webpack не должен связывать node_modules, и это может помочь с этим, но когда я пытаюсь его использовать, я получаю сообщение об ошибке: недопустимый объект конфигурации. Webpack был инициализирован с использованием объекта конфигурации, не соответствующего схеме API. Может в этом проблема?
Измените заголовок вопроса: «Недопустимый объект конфигурации - Webpack», чтобы привлечь экспертов по Webpack.
Я сделал это. Спасибо за ваши ответы.
Вы неправильно понимаете, что такое wepback-node-externals. Это просто скажет webpack не компилировать определенные пакеты, потому что они доступны во время выполнения (например, fs
в nodejs). Это не сделает их доступными в браузере. как сказал @ num8er, вам нужно найти другой твиттер sdk или написать его самостоятельно.
Главный вопрос: собираетесь ли вы делать серверное приложение или интерфейсное приложение? Net, tls, fs - это основные модули nodejs, и если вы думаете, что webpack будет связывать элементы node - вы ошибаетесь. Поэтому, пожалуйста, добавьте дополнительные пояснения об архитектуре приложения и файловой структуре (снимки экрана с файлами, папками)