Я хочу перенести существующую систему сборки на основе Ruby в нашем проекте AngularJS (1.4.X) на Webpack. Код проекта не использует модули JS и использует старый шаблон кода Angular. Я не уверен, как Webpack найдет все файлы контроллера и фабрики в проекте.
Структура папок такая,
-app
- assets
- javascripts
- ctrl
- controllerA.js
- controllerB.js
-services
-serviceA.js
-serviceB.js
- angular.min.js
- angular-route.js
- main.js
Когда я использую main.js в своей точке входа, он копируется в папку сборки, но ни один из других файлов не обрабатывается Webpack, даже если я использую правило babel-loader для .js.
Один из вариантов, который я могу придумать, — использовать все остальные файлы в отдельном файле пакета, используя что-то вроде https://www.npmjs.com/package/webpack-merge-and-include-globally, но я хочу знать, есть ли лучший способ сделать это.
Моя текущая конфигурация веб-пакета выглядит следующим образом.
module.exports = {
context: __dirname +'/app',
entry: {
'app-portal': [
'/assets/javascripts/main.js',
'/assets/javascripts/angular.min.js',
'/assets/stylesheets/portal/style.css',
'/assets/stylesheets/portal/navbar.css',
'/assets/stylesheets/portal/animation.css',
'/assets/stylesheets/portal/bootstrap.min.css',
'/assets/stylesheets/portal/bootstrap-notify.css',
'/assets/stylesheets/portal/fontello.css',
]
},
output: {
path: __dirname + "/dist/assets",
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
},
},
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
{
loader:'css-loader',
options: {
sourceMap: true,
url: false,
},
},
],
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
template: './views/portal/index.html',
filename: '../index.html',
}),
new MiniCssExtractPlugin({
filename: './[name].css',
linkType: false,
ignoreOrder: false,
}),
new CopyPlugin({
patterns: [
{
from: './views/portal/**/*.*',
to: "../[name].[ext]",
globOptions: {
ignore: [
'**/index.*',
],
},
},
{
from: './assets/fonts/*.*',
to: "./[name].[ext]",
},
{
from: './assets/images/portal/*.*',
to: "./[name].[ext]",
},
{
from: './assets/theme/*.*',
to: "./[name].[ext]",
}
]
}),
],
Вероятно, Webpack не подходит для меня, так как я не хочу менять исходный код, как это предлагается в Плагины Webpack и/или стратегии для AngularJS