This repo is already configured for AngularJS framework. Supports preprocessor CSS languages: SASS, LESS, and STYLUS. Contains developer dev server that hard reloads, all necessary packages, and HTML preprocessors like EJS, PUG, and Handlebars.
In your terminal type following commands:
git clone https://github.com/DudkinON/webpack-angularjs.git
cd webpack-angularjs
then you need install packages:
npm install
yarn install
Next, build the project with following command:
npm run build:dev
then, run server:
npm run server:dev
For build production code type:
npm run build
then run http server:
npm run server:prod
server will run on http://127.0.0.1:3000
Node: by default server uses port 3000, make sure that this port is free
After server is running you will see:
This part discusses how to use HTML preprocessors
Open config/webpack.dev.config.js
file and find:
plugins: [
new webpack.HotModuleReplacementPlugin(),
new HTMLWebpackPlugin({
template: "./src/html/index.html",
title: "Webpack: AngularJS configuration"
})
]
change index.html
to index.pug
change index.html
to index.ejs
change index.html
to index.hbs
Then you can open src/html/index.[ejs|hbs|pug]
file and use your favorite preprocessor
This part discusses how to use CSS preprocessors
Open src/js/main.js
and find:
require("../styles/main.css");
then change main.css
to main.less
then change main.css
to main.sass
then change main.css
to main.styl
Open file src/styles/main.[less|sass|styl]
and work with your favorite CSS preprocessor
Angular JS application files located in src/js/app
. The main.js
is the entry point for AngularJS app.
This repo sharing under MIT license